Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

web: Throw an error when reference types are unsupported #18838

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 11 additions & 0 deletions web/packages/core/src/internal/player/inner.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ import { showPanicScreen } from "../ui/panic";
import { createRuffleBuilder } from "../../load-ruffle";
import { lookupElement } from "../register-element";
import { configureBuilder } from "../builder";
import { referenceTypes } from "wasm-feature-detect";

const DIMENSION_REGEX = /^\s*(\d+(\.\d+)?(%)?)/;

Expand Down Expand Up @@ -855,6 +856,16 @@ export class InnerPlayer {
this.loadedConfig.backgroundColor;
}

// We may theoretically need to check everything listed on https://github.com/rust-lang/rust/blob/master/src/doc/rustc/src/platform-support/wasm32-unknown-unknown.md#enabled-webassembly-features
// but this is the only extension I know completely breaks our WASM module if unsupported
const necessaryExtensionsSupported: boolean = await referenceTypes();
if (!necessaryExtensionsSupported) {
Copy link
Contributor Author

@danielhjacobs danielhjacobs Dec 3, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Note: Right here, it would be possible by exporting isFlashEnabledBrowser from the polyfills file and importing it here to add this code:

                if ("url" in options && isFlashEnabledBrowser()) {
                    const flashEmbed = Object.assign(document.createElement('embed'), {
                        src: new URL(options.url, document.baseURI).href,
                        width: "100%",
                        height: "100%",
                    });
                    this.container.textContent = "";
                    this.container.appendChild(flashEmbed);
                    return;
                }

That would create a Flash embed on Flash-enabled browsers which do not have reference-types support when using the Ruffle API with a URL (rather than a data buffer). It ignores any configuration options in favor of simplicity, though we can be less simple by doing this: https://github.com/ruffle-rs/ruffle/pull/16523/files#diff-467a580c71d4e3b96032b54a2a292d485f3b83f87ba2478daf693bac6d532965R1019-R1041

That said, it may not be desired as noted in #16523

Copy link
Contributor Author

@danielhjacobs danielhjacobs Dec 6, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

danielhjacobs/ruffle@throw-direct-error-when-reference-types-unsupported...danielhjacobs:ruffle:make-embed-if-flash-supported-ruffle-not

This would create Flash embeds if reference-types is unsupported but Flash is supported. I mainly just wrote it for fun, as it was interesting to try to let DataLoadOptions work too.

const baseError = new Error("Necessary WebAssembly extensions unsupported");
const loadError = new LoadRuffleWasmError(baseError);
this.panic(loadError);
return;
}

await this.ensureFreshInstance();

if ("url" in options) {
Expand Down
13 changes: 13 additions & 0 deletions web/packages/core/src/internal/ui/panic.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -308,6 +308,19 @@ function createPanicError(error: Error | null): {
};
}

if (message === "necessary webassembly extensions unsupported") {
// Self hosted: User has a browser without support for necessary WebAssembly extensions
return {
body: textAsParagraphs("error-wasm-unsupported-browser"),
actions: [
CommonActions.openWiki(
"#web",
),
CommonActions.ShowDetails,
],
};
}

// Self hosted: Cannot load `.wasm` file - file not found
return {
body: textAsParagraphs("error-wasm-not-found"),
Expand Down
4 changes: 4 additions & 0 deletions web/packages/core/texts/en-US/messages.ftl
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,10 @@ error-wasm-disabled-on-edge =
To fix this, try opening your browser's settings, clicking "Privacy, search, and services", scrolling down, and turning off "Enhance your security on the web".
This will allow your browser to load the required ".wasm" files.
If the issue persists, you might have to use a different browser.
error-wasm-unsupported-browser =
The browser you are using does not support the WebAssembly extensions Ruffle requires to run.
Please switch to a supported browser.
You can find a list of supported browsers on the Wiki.
error-javascript-conflict =
Ruffle has encountered a major issue whilst trying to initialize.
It seems like this page uses JavaScript code that conflicts with Ruffle.
Expand Down