I am writing a safari web extension at the moment in Xcode. I want tab a button inside my popup window which than calls the firebase firestore database to get some data. Therefore I want to include the firestore library in my popup.js script with import { initializeApp, getFirestore, collection } from 'https://www.gstatic.com/firebasejs/10.10.0/firebase-firestore.js'
But as I am doing this I get the error
Refused to load https://www.gstatic.com/firebasejs/10.10.0/firebase-firestore.js because it does not appear in the script-src directive of the Content Security Policy.
even tho I have this specific link inside my manifest and in my info.plist file.
This is my info.plist file
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>NSExtension</key>
<dict>
<key>NSExtensionAttributes</key>
<dict>
<key>SFSafariToolbarItem</key>
<dict>
<key>SFToolbarItemClassName</key>
<string>ViewController</string>
</dict>
</dict>
<key>NSExtensionMainStoryboard</key>
<string>MainInterface</string>
<key>NSExtensionPointIdentifier</key>
<string>com.apple.Safari.web-extension</string>
<key>content-security-policy</key>
<string>default-src 'self'; script-src 'self' https://www.gstatic.com/firebasejs/10.10.0/firebase-firestore.js;</string>
</dict>
</dict>
</plist>
And this is my manifest file
{
"manifest_version": 3,
"default_locale": "en",
"name": "__MSG_extension_name__",
"description": "__MSG_extension_description__",
"version": "1.0",
"icons": {
"48": "images/icon-48.png",
"96": "images/icon-96.png",
"128": "images/icon-128.png",
"256": "images/icon-256.png",
"512": "images/icon-512.png"
},
"background": {
"scripts": "background.js"
},
"content_scripts": [{
"js": [ "content.js" ],
"matches": [ "*://example.com/*" ]
}],
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "images/toolbar-icon-16.png",
"19": "images/toolbar-icon-19.png",
"32": "images/toolbar-icon-32.png",
"38": "images/toolbar-icon-38.png",
"48": "images/toolbar-icon-48.png",
"72": "images/toolbar-icon-72.png"
}
},
"permissions": [ "nativeMessaging", "activeTab", "tabs" ],
"content_security_policy": {
"extension_pages": "default-src 'self'; script-src 'self' https://www.gstatic.com/firebasejs/10.10.0/firebase-firestore.js; style-src 'self' 'unsafe-inline';"
}
}
Can you tell me what I am doing wrong and what the correct way of implementing this domain is?