web: Fix extension webpack import not working (close #10981) #19664

thy486 · 2025-03-01T11:57:41Z

Close #10981
Continue with PR #19348, this PR is used to fix the ruffle.js webpack import module.

thy486 · 2025-03-01T12:27:54Z

For this PR, I packaged it as a safari extension (use my xcode certificate), and this is its running effect.

thy486 · 2025-03-01T16:22:34Z

web/packages/extension/src/ruffle.ts

+    return prop in obj && (obj as Record<PropertyKey, unknown>)[prop] !== "";
+}
+
+// Copied from Webpack: https://github.com/webpack/webpack/blob/f1bdec5cc70236083e45b665831d5d79d6485db7/lib/runtime/AutoPublicPathRuntimeModule.js#L75


This link may be confusing.
It actually comes from webpack automatic publicPath. Specifically refers to get publicPath from the currentScript.src.

web/packages/extension/src/ruffle.ts

thy486 · 2025-03-01T16:42:54Z

web/packages/extension/src/ruffle.ts

+            );
+        }
+    }
+    // TODO: Process other situations when mask url not webkit-masked-url://hidden/


Since the current problems are relatively easy to solve in a targeted manner, I made a simple fix. But this may not be the best or most general solution, so I left a todo here

web/packages/extension/src/ruffle.ts

thy486 · 2025-03-01T16:50:26Z

web/packages/extension/src/ruffle.ts

+    };
+    // Reset webpack public path should be safe when it is using mask url
+    if ("webkit-masked-url://hidden/" === scriptUrl) {
+        const webpackCurrentPublicPath = __webpack_public_path__;


The __webpack_public_path__ runtime code is actually like __webpack_require__.p, so it could be set and get. But this is a webpack only logic.

Related documents

danielhjacobs

Note: My review comes from the perspective of suggesting simplications to the added code, without actually considering how much of the added code is necessary. My knowledge of webpack is unfortunately limited, so hopefully someone else can review from that perspective.

web/packages/core/src/current-script.ts

web/packages/extension/src/ruffle.ts

web/packages/extension/global.d.ts

web/packages/core/src/current-script.ts

thy486 · 2025-04-08T18:58:51Z

Thank you very much for the review. I have modified my code as required and re-pushed it. Please review it again when you have time

web/packages/extension/src/ruffle.ts

danielhjacobs · 2025-04-18T18:59:41Z

Let me see if I understand the logic:

When we do script.src = url, Safari masks that to "webkit-masked-url://hidden/".

The previous change attempted a targeted fix: the only reason we need to know script.src is because the url has a query parameter called ID that needs to be used in the postMessage. You worked around that by setting an attribute on the script called ruffle-id and using that.

And we need this change because:

webpack's code for the automatic public path also uses the script.src. That src is "webkit-masked-url://hidden/" so that's what webpack tries to load.

So the new code says:

If script.src = url and then immediately script.src !== url, ruffle-src-polyfill = url. Safari doesn't mask that because it's not a script.src.

If ruffle-src-polyfill and __webpack_public_path__ === scriptAutoPublicPath, __webpack_public_path__ is updated to the original ruffle-src-polyfill converted to a public path (https://github.com/webpack/webpack/blob/f1bdec5cc70236083e45b665831d5d79d6485db7/lib/runtime/AutoPublicPathRuntimeModule.js#L75).

If script.src === "webkit-masked-url://hidden/", getScriptOriginalSrc gets ruffle-src-polyfill, otherwise it gets script.src. That is used to determine if isExtension instead of always the script.src as before.

…uffle-rs#19348)

danielhjacobs · 2025-04-24T19:48:08Z

I hate to do this after you put so much work into this PR, but I wanted to improve the code logic and ended up superseding this PR. Can you test #20255? Ideally, it will fix the issue just as well.

danielhjacobs · 2025-04-26T11:45:25Z

Please test today's nightly with Safari. If it works, this PR can be closed.

thy486 · 2025-04-27T02:14:52Z

Please test today's nightly with Safari. If it works, this PR can be closed.

It works. Thank you for your work.

danielhjacobs · 2025-04-27T02:38:33Z

Superseded by #20264

thy486 force-pushed the fix-safari-extension-webpack-require branch from 8b7e49f to 0c1291a Compare March 1, 2025 12:18

thy486 commented Mar 1, 2025

View reviewed changes

n0samu added the newsworthy label Mar 1, 2025

kjarosh added A-web Area: Web & Extensions extension Related to the Ruffle WebExtension T-fix Type: Bug fix (in something that's supposed to work already) safari labels Mar 2, 2025

thy486 force-pushed the fix-safari-extension-webpack-require branch from 0c1291a to fca80bc Compare March 4, 2025 06:07

danielhjacobs mentioned this pull request Mar 12, 2025

extension: Don't build vanilla WASM module for web extensions #19316

Closed

danielhjacobs requested a review from evilpie April 7, 2025 15:37

danielhjacobs requested changes Apr 7, 2025

View reviewed changes

danielhjacobs reviewed Apr 7, 2025

View reviewed changes

web/packages/extension/global.d.ts Outdated Show resolved Hide resolved

evilpie reviewed Apr 8, 2025

View reviewed changes

web/packages/core/src/current-script.ts Outdated Show resolved Hide resolved

thy486 force-pushed the fix-safari-extension-webpack-require branch 2 times, most recently from e96bdc7 to 9404730 Compare April 8, 2025 18:54

thy486 requested a review from danielhjacobs April 9, 2025 01:45

evilpie reviewed Apr 13, 2025

View reviewed changes

web/packages/extension/src/ruffle.ts Outdated Show resolved Hide resolved

thy486 force-pushed the fix-safari-extension-webpack-require branch 3 times, most recently from fb16b96 to 949eaf2 Compare April 18, 2025 00:44

danielhjacobs reviewed Apr 18, 2025

View reviewed changes

web/packages/extension/src/ruffle.ts Outdated Show resolved Hide resolved

web: Fix extension webpack import not working in Safari 16 (part of r…

c16bec6

…uffle-rs#19348)

thy486 force-pushed the fix-safari-extension-webpack-require branch from 949eaf2 to c16bec6 Compare April 19, 2025 15:39

danielhjacobs mentioned this pull request Apr 24, 2025

extension: Stop injecting scripts on any browser except Firefox 127 and below #20255

Merged

danielhjacobs mentioned this pull request Apr 26, 2025

extension: Fix extension on Safari 16+ #20264

Merged

danielhjacobs closed this Apr 27, 2025

Uh oh!

web: Fix extension webpack import not working (close #10981) #19664

web: Fix extension webpack import not working (close #10981) #19664

Uh oh!

Conversation

thy486 commented Mar 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

thy486 commented Mar 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

thy486 Mar 1, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

thy486 Mar 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

thy486 Mar 1, 2025

Choose a reason for hiding this comment

Uh oh!

danielhjacobs left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

thy486 commented Apr 8, 2025

Uh oh!

Uh oh!

Uh oh!

danielhjacobs commented Apr 18, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

danielhjacobs commented Apr 24, 2025

Uh oh!

danielhjacobs commented Apr 26, 2025

Uh oh!

thy486 commented Apr 27, 2025

Uh oh!

danielhjacobs commented Apr 27, 2025

Uh oh!

Uh oh!

thy486 commented Mar 1, 2025 •

edited

Loading

thy486 commented Mar 1, 2025 •

edited

Loading

thy486 Mar 1, 2025 •

edited

Loading

danielhjacobs commented Apr 18, 2025 •

edited

Loading