Add Safari extension build target

[suhailskhan]

This is an alternative implementation to those in #133, #443, and #487.

Similarly to #443, this adds a Safari extension as a webpack plugin pattern. It then generates an Xcode project for the macOS and iOS apps using a build script in package.json.

Building the Safari extension now requires only one short command. Running npm run build:safari will run the standard webpack build steps, and then invokes the Xcode Safari extension generator to create an Xcode project. All files generated by doing this will be found under Extensions/combined/dist. At this point, the Xcode project opens automatically and one can compile and export copies of the Mac and iOS Safari extensions.

What I did differently from the other PRs is I treated the Xcode project as a build artifact, rather than treat it as part of the codebase for the extension. Not only does it keep the repo’s directory structure easy on the eyes, but it can be beneficial for other reasons. It ensures the Mac and iOS apps are always made ”cleanly”. Future Xcode releases may change aspects of how it generates Safari extension projects (I believe this already had happened in the past), so avoiding ”hard-coding” the Xcode project as part of the extension’s codebase might avoid problems down the line.

I exported a Safari extension and tested it on Safari 16.3 and 16.4 on macOS 13.3 and iOS 16.3, and all functionality appears identical to that of the extension on Firefox and Chrome.

@rdev, @CamilleScholtz, @1998code, curious to hear your thoughts as you submitted the PRs that I mentioned. re: #127

[1998code]

Hi @suhailskhan, just tried your code. Looks good to me.

⚠️ Few minor problems were found. 1) The numbers are repeated. 2) npm run dev:safari will be stuck in the terminal.

3) Maybe I am in macOS beta and got this warning. The extension still works fine.

✅ Checked: 1) Run npm run build:safari can build dist and open Xcode. 2) After signing, the extension can display correctly.

Thanks.

[suhailskhan]

Thanks for the review, @1998code.

1. The numbers are repeated.

It looks like this is an issue stemming from upstream. Here’s Chrome when using the extension built from main:

2. npm run dev:safari will be stuck in the terminal.

I see. I overlooked that the file watcher spawned by npm run dev would keep any subsequent commands from running, including the Safari extension generator. npm run dev:safari would probably not be necessary since Xcode and Safari themselves would provide the debugging workflow anyway. I’ll remove that build script and keep only npm run build:safari.

3) Maybe I am in macOS beta and got this warning. The extension still works fine.

Looks like it’s a beta-related issue. Here is my output:

App Name: Return YouTube Dislike
App Bundle Identifier: com.returnyoutubedislike.safari-ext
Platform: All
Language: Swift

[Anarios]

Wow, perfectly done.