ruby.wasm provides JS::RequireRemote#load. The user uses this method to replace the require_relative method.

ledsun · ledsun · commit 554800c6dd66 · 2023-11-14T23:12:15.000+09:00
diff --git a/ext/js/lib/js/require_remote.rb b/ext/js/lib/js/require_remote.rb
@@ -1,4 +1,5 @@
 require "singleton"
+require "js"
 require_relative "./url_resolver"
 
 module JS
@@ -11,7 +12,11 @@ def initialize
       set_base_url
     end
 
-    def require_relative(relative_feature)
+    # Load the given feature from remote.
+    # The use_maps parameter is not used.
+    # This is a parameter to keep the method name unchanged when supporting require methods.
+    # Maps like import maps will be used.
+    def load(relative_feature, use_maps: false)
       location = get_location(relative_feature)
       response = JS.global.fetch(location.url).await
 
diff --git a/packages/npm-packages/ruby-wasm-wasi/example/require_relative/index.html b/packages/npm-packages/ruby-wasm-wasi/example/require_relative/index.html
@@ -1,6 +1,31 @@
 <html>
   <script src="https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@2.1.0/dist/browser.script.iife.js"></script>
   <script type="text/ruby" data-eval="async">
+    # Patch require_relative to load from remote
+    require 'js/require_remote'
+
+    module Kernel
+      alias original_require_relative require_relative
+
+      # The require_relative may be used in the embedded Gem.
+      # First try to load from the built-in filesystem, and if that fails,
+      # load from the URL.
+      def require_relative(path)
+        caller_path = caller_locations(1, 1).first.absolute_path || ''
+        dir = File.dirname(caller_path)
+        file = File.absolute_path(path, dir)
+
+        original_require_relative(file)
+      rescue LoadError
+        JS::RequireRemote.instance.load(path)
+      end
+    end
+
+    # The above patch does not break the original require_relative
+    require 'csv'
+    csv = CSV.new "foo\nbar\n"
+
+    # Load the main script
     require_relative 'main'
   </script>
 </html>
diff --git a/packages/npm-packages/ruby-wasm-wasi/src/browser.script.ts b/packages/npm-packages/ruby-wasm-wasi/src/browser.script.ts
@@ -15,8 +15,6 @@ export const main = async (
 
   globalThis.rubyVM = vm;
 
-  patchRequireRelative(vm);
-
   // Wait for the text/ruby script tag to be read.
   // It may take some time to read ruby+stdlib.wasm
   // and DOMContentLoaded has already been fired.
@@ -99,28 +97,3 @@ const compileWebAssemblyModule = async function (
     return WebAssembly.compileStreaming(response);
   }
 };
-
-const patchRequireRelative = (vm: RubyVM) => {
-  const patch = `
-  require 'js'
-  require 'js/require_remote'
-
-  module Kernel
-    alias original_require_relative require_relative
-
-    # The require_relative may be used in the embedded Gem.
-    # First try to load from the built-in filesystem, and if that fails,
-    # load from the URL.
-    def require_relative(path)
-      caller_path = caller_locations(1, 1).first.absolute_path || ''
-      dir = File.dirname(caller_path)
-      file = File.absolute_path(path, dir)
-
-      original_require_relative(file)
-    rescue LoadError
-      JS::RequireRemote.instance.require_relative(path)
-    end
-  end
-  `;
-  vm.eval(patch);
-};
diff --git a/packages/npm-packages/ruby-wasm-wasi/test-e2e/integrations/browser-script.spec.ts b/packages/npm-packages/ruby-wasm-wasi/test-e2e/integrations/browser-script.spec.ts
@@ -61,22 +61,8 @@ if (!process.env.RUBY_NPM_PACKAGE_ROOT) {
     });
   });
 
-  test.describe("require_relative", () => {
-    test("patch does not break original require_relative", async ({ page }) => {
-      const resolve = await resolveBinding(page, "checkResolved");
-      await page.setContent(`
-      <script src="https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@latest/dist/browser.script.iife.js">
-      </script>
-      <script type="text/ruby" data-eval="async">
-      require 'csv'
-      csv = CSV.new "foo\nbar\n"
-      JS.global.checkResolved csv.first
-      </script>
-     `);
-      expect(await resolve()).toStrictEqual(["foo"]);
-    });
-
-    test("require_relative throws error when gem is not found", async ({
+  test.describe('JS::RequireRemote#load', () => {
+    test("JS::RequireRemote#load throws error when gem is not found", async ({
       page,
     }) => {
       // Opens the URL that will be used as the basis for determining the relative URL.
@@ -87,7 +73,8 @@ if (!process.env.RUBY_NPM_PACKAGE_ROOT) {
       <script src="https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@latest/dist/browser.script.iife.js">
       </script>
       <script type="text/ruby" data-eval="async">
-      require_relative 'foo'
+        require 'js/require_remote'
+        JS::RequireRemote.instance.load 'foo'
       </script>
      `);
       const error = await page.waitForEvent("pageerror");
