Maskbook
Maskbook copied to clipboard
[Demand] Support Safari on macOS and iOS 15
MDN data: https://github.com/mdn/browser-compat-data/pull/6320 Apple document: https://developer.apple.com/documentation/safariservices/safari_web_extensions
@Jack-Works are we still going to support safari 14? If not, I'd suggest we close this issue first.
We can leave it thou no plan on supporting it currently.
let's close it then.
Re-open this since it is not resolved. We may want to revisit this in the future since iOS 15 just supported Web Extension yet.
I'm still new to this project, I'll look into this It is true that a number of users use the Apple browser
some info https://developer.apple.com/forums/thread/710876
Safari 15.4 introduced support for manifest version 3. Safari 16 continues to support both manifest version 2 and version 3. Manifest version 3 brings new and improved APIs for developers but if you have an existing mv2 extension, it will continue to work in Safari 16.
Our extension has Chrome Manifest V3 support, but I didn't test for Firefox and Safari (for V3). Since I got a new mac device, I may be able to start to investigate support for Safari.
Our extension has Chrome Manifest V3 support, but I didn't test for Firefox and Safari (for V3). Since I got a new mac device, I may be able to start to investigate support for Safari.
I will gather information about the project as I learn about it and try to see what needs to be modified to make the migration successful.
@Jack-Works
Chrome Manifest V3 support is not yet complete, I think, I tried to build the Chrome MV3, can not open the pop page in Chrome ,
which has a number of errors
i use npm run build:mv3
@qqqzhch Hi, it used to run on Chrome MV3 but we lack a test of it so it gets regression. I believe those issues are easy to fix.
@Jack-Works Okay, I know, I'm not very familiar with the project, I'll learn something about the project in the process of finding out what went wrong.
@Jack-Works I've got the latest code to build mv3 to work in Google Chrome
I've been working on this for the past few days, as much of the information on the internet is rather outdated and can only be used as a reference, but in practice need to create your own projects
1 need to create the project yourself in xcode, the information on the internet is rather outdated
2 need to upgrade browser to the latest v16 because
Cannot import script to service worker with self.importScripts
https://developer.apple.com/forums/thread/711341
3 Debugging method The debugging method is a little different from the Google Chrome plugin
https://developer.apple.com/documentation/safariservices/safari_web_extensions/troubleshooting_your_safari_web_extension
4 Add a try catch to view the backend error log, because after an error, the installation will not see the error
try {
importScripts(
'./worker_env.js',
'./gun.js',
'./polyfill/browser-polyfill.js',
'./sandboxed-modules/mv3-preload.js',
'./js/background.js',
)
}
catch(error){
console.log(error)
}
I can already see the error message, but I can't pinpoint the exact error yet
about the Unexpected token '{'
, maybe you can try to downgrade the syntax target. Currently we're targeting ES2022 syntax and that may be unsupported by Safari.
@Jack-Works Okay, I'll try it.
I have tried to modify the b/packages/mask/.webpack/config.ts
target: ['web', 'es5'] Then it is packaged and put into the browser plug-in, but the error remains the same. Are there other configuration files that need to be changed as well?
ok I'll investigate this
play around with Xcode and Safari for a while, and I found it's actually not debuggable.
https://developer.apple.com/forums/thread/720904
I maybe not investigate this these days unless I have more input.
play around with Xcode and Safari for a while, and I found it's actually not debuggable.
https://developer.apple.com/forums/thread/720904
I maybe not investigate this these days unless I have more input.
1 1 If the error is reported in the service worker, the debugging screen will not open in the browser.
like this
so
try {
importScripts(
'./worker_env.js',
'./gun.js',
'./polyfill/browser-polyfill.js',
'./sandboxed-modules/mv3-preload.js',
'./js/background.js',
)
}
catch(error){
console.log(error)
}
2 The location of the debug menu is really difficult to find the first time
![WX20230411-092935@2x](https://user-images.githubusercontent.com/3917994/231031978-8ef33a9c-a58c-46b4-8526-26535de6c20a.png)
![WX20230411-092904@2x](https://user-images.githubusercontent.com/3917994/231032015-bb373cea-4170-4dad-97a2-6b2a73d5ca2e.png)
Safari version v16.3
can you share how you configure the Xcode project for the extension?
can you share how you configure the Xcode project for the extension?
I'll organize the information I've seen and write it in the issues
afaik a safari extension requires an Xcode project. maybe you can open a PR containing the Xcode project you created?
afaik a safari extension requires an Xcode project. maybe you can open a PR containing the Xcode project you created?
Okay, I'll write a post documenting the creation of the project that, and then create a pr for testing
Record the steps and things to note to create Safari browser plug-in extensions with mv3 https://docs.google.com/document/d/1SeV6-P_rXHUwvSnLHpgF8tuk9CK7-7YPnl6KrCARYC0/edit?usp=sharing
@Jack-Works To create a project, i need to generate a folder under Maskbook/packages, the name of the folder is called MaskSafari better or MaskSafariExtension better?
https://github.com/DimensionDev/Maskbook/pull/9436 @Jack-Works Added the xcode file for creating projects
Before local testing is more casual, I put the whole built project in and then operate in xocde. Now I plan to 1 first create a build folder in the resource directory, copy the built mv3 files into it. 2 write a new configuration file based on the existing configuration file and put it under the resource directory. This will allow for better testing
To record some information, the error message I encountered in my troubleshooting project was
- /build/js/npm-ns.masknet.compartment.js A syntax error occurs when loading, which is quite puzzling, because the build has been successful.
- fetchBlob and localStorage need to be checked to see how browsers support them
Hi I'm cleaning up our infrastructure to prepare for Safari!