JavaScript env for browsers is broken #246

temeddix · 2023-11-06T14:38:38Z

Hi, I've been testing jco on NodeJS and it has been working well. Great project!

However, I couldn't get it to compile JavaScript files for the browser(without import and exports). How can I do that? I dug in the docs and guides, but no explanation was there that I could find. Do I have to use Webpack or Vite to transpile ES JavaScript to Browser JavaScript?

The text was updated successfully, but these errors were encountered:

temeddix · 2023-11-06T14:52:51Z

When I run npx webpack, the following error occurs:

PS C:\Users\temed\Documents\GitHub\jco-test> npx webpack
assets by status 2.54 MiB [cached] 2 assets
asset main.js 98 KiB [emitted] (name: main)
runtime modules 4.23 KiB 7 modules
cacheable modules 77.9 KiB (javascript) 2.54 MiB (asset)
  javascript modules 77.9 KiB
    modules by path ./node_modules/@bytecodealliance/preview2-shim/lib/ 15.1 KiB
      ./node_modules/@bytecodealliance/preview2-shim/lib/browser/cli.js 1.25 KiB [built] [code generated]
      ./node_modules/@bytecodealliance/preview2-shim/lib/browser/filesystem.js 8.24 KiB [built] [code generated]
      ./node_modules/@bytecodealliance/preview2-shim/lib/browser/clocks.js 1010 bytes [built] [code generated]
      ./node_modules/@bytecodealliance/preview2-shim/lib/common/io.js 4.62 KiB [built] [code generated]
    ./browser.js 94 bytes [built] [code generated]
    ./out_dir/jco_test.js 62.7 KiB [built] [code generated]
  asset modules 84 bytes (javascript) 2.54 MiB (asset)
    ./out_dir/jco_test.core.wasm 42 bytes (javascript) 2.51 MiB (asset) [built] [code generated]
    ./out_dir/jco_test.core2.wasm 42 bytes (javascript) 28.7 KiB (asset) [built] [code generated]

ERROR in ./node_modules/@bytecodealliance/preview2-shim/lib/browser/filesystem.js 1:0-30
Module not found: Error: Can't resolve './io.js' in 'C:\Users\temed\Documents\GitHub\jco-test\node_modules\@bytecodealliance\preview2-shim\lib\browser'
resolve './io.js' in 'C:\Users\temed\Documents\GitHub\jco-test\node_modules\@bytecodealliance\preview2-shim\lib\browser'
  using description file: C:\Users\temed\Documents\GitHub\jco-test\node_modules\@bytecodealliance\preview2-shim\package.json (relative path: ./lib/browser)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: C:\Users\temed\Documents\GitHub\jco-test\node_modules\@bytecodealliance\preview2-shim\package.json (relative path: ./lib/browser/io.js)
      Field 'browser' doesn't contain a valid alias configuration
      C:\Users\temed\Documents\GitHub\jco-test\node_modules\@bytecodealliance\preview2-shim\lib\browser\io.js doesn't exist
 @ ./out_dir/jco_test.js 3:0-77 17:27-35 20:26-31
 @ ./browser.js 1:0-51 3:0-10

webpack 5.89.0 compiled with 1 error in 358 ms

Looks like io.js is missing...

temeddix · 2023-11-06T14:55:58Z

Repo is available here:

https://github.com/temeddix/jco-test

yoshuawuyts · 2023-11-06T15:43:25Z

@temeddix hi there, thanks for asking this question! - To make sure I understand correctly what you're asking: you're trying to use code transpiled by jco in the browser without using import-notation?

If that's right, can I ask why you're doing that? import is natively supported in browsers when used in ES module contexts. If webpack isn't working correctly, that's something we should investigate. But I don't believe webpack should be required to use import in the browser?

temeddix · 2023-11-06T16:02:04Z

Thanks for the quick reply :)

Basically, I wish to write this:

<!DOCTYPE html>
<html>
  <head>
    <title>Sample HTML Page</title>
  </head>
  <body>
    <h1>My HTML Page</h1>
    <script src="jco_test.js"></script>
  </body>
</html>

instead of this:

<!DOCTYPE html>
<html>
  <head>
    <title>Sample HTML Page</title>
  </head>
  <body>
    <h1>My HTML Page</h1>
    <script type="importmap">
      {
        "imports": {
          "@bytecodealliance/preview2-shim/cli": "./packages/preview2-shim/lib/browser/cli.js",
          "@bytecodealliance/preview2-shim/clocks": "./packages/preview2-shim/lib/browser/clocks.js",
          "@bytecodealliance/preview2-shim/filesystem": "./packages/preview2-shim/lib/browser/filesystem.js",
          "@bytecodealliance/preview2-shim/http": "./packages/preview2-shim/lib/browser/http.js",
          "@bytecodealliance/preview2-shim/io": "./packages/preview2-shim/lib/browser/io.js",
          "@bytecodealliance/preview2-shim/logging": "./packages/preview2-shim/lib/browser/logging.js",
          "@bytecodealliance/preview2-shim/poll": "./packages/preview2-shim/lib/browser/poll.js",
          "@bytecodealliance/preview2-shim/random": "./packages/preview2-shim/lib/browser/random.js",
          "@bytecodealliance/preview2-shim/sockets": "./packages/preview2-shim/lib/browser/sockets.js",
          "jco": "./src/browser.js"
        }
      }
    </script>
    <script type="module" src="jco_test.js"></script>
  </body>
</html>

With this importmap, it looks like I need to copy the whole packages/preview2-shim folder to my own project repo.

manekinekko · 2023-11-06T16:15:07Z

@yoshuawuyts @guybedford I could reproduce this issue. A basic hello world app does not load currently load in the browser.

temeddix · 2023-11-06T16:26:13Z

The browser says that io.js is not found, even if I provide the proper importmap. Other shim modules are loaded fine.

temeddix · 2023-11-06T16:31:25Z

In my humble opinion, on browsers, it will be good to open a file dialog that requires user selection whenever file read/write syscall is made. Currently the support status of file operation for the browser is just written as N/A.

guybedford · 2023-11-06T17:57:07Z

Thanks for posting, yes the browser build is currently not working. This was due to recent IO work, where the browser build is not currently tested in CI (test/browser.html).

I've added a fix to the current IO PR in cf6de64.

temeddix · 2023-11-06T18:20:03Z

jco_test.js:2165 Uncaught TypeError: Right-hand side of 'instanceof' is not an object
    at trampoline30 (jco_test.js:2165:13)
    at wit-component:shim.indirect-wasi:cli/terminal-stdin@0.2.0-rc-2023-10-18-get-terminal-stdin (wit-component:shim-37cb1faa:0x213)
    at wit-component:adapter:wasi_snapshot_preview1._ZN22wasi_snapshot_preview111descriptors11Descriptors3new17h9fed67187c4adadfE (jco_test.core2.wasm:0x47c2)
    at wit-component:adapter:wasi_snapshot_preview1._ZN22wasi_snapshot_preview15State11descriptors17he0b52988223bcb4bE (jco_test.core2.wasm:0x1aa7)
    at wit-component:adapter:wasi_snapshot_preview1.fd_write (jco_test.core2.wasm:0x2ea4)
    at wit-component:shim.adapt-wasi_snapshot_preview1-fd_write (wit-component:shim-37cb1faa:0x261)
    at _ZN4wasi13lib_generated8fd_write17hd4964fea612b930fE (jco_test.core.wasm:0xf882)
    at _ZN60_$LT$std..io..stdio..StdoutRaw$u20$as$u20$std..io..Write$GT$9write_all17ha8a5c415d0be9b21E (jco_test.core.wasm:0xc6c7)
    at _ZN61_$LT$std..io..stdio..StdoutLock$u20$as$u20$std..io..Write$GT$9write_all17haf68676363d7b838E (jco_test.core.wasm:0x9b65)
    at _ZN80_$LT$std..io..Write..write_fmt..Adapter$LT$T$GT$$u20$as$u20$core..fmt..Write$GT$9write_str17h10bcf4b729d70e99E (jco_test.core.wasm:0xd8a8)

With the new io.js file from the cf6d364 commit, the shim modules are loaded well. However, I'm getting this error now. May I ask what would be the cause?

https://github.com/temeddix/jco-test

yoshuawuyts added question Further information is requested target-web This issue is about the Web target labels Nov 6, 2023

temeddix mentioned this issue Nov 6, 2023

From wasm32-unknown-unknown to wasm32-wasi cunarist/rinf#204

Open

4 tasks

temeddix changed the title ~~JavaScript compilation for browsers~~ JavaScript compilation for browsers is broken Nov 6, 2023

guybedford mentioned this issue Nov 7, 2023

fix: browser shim #252

Merged

temeddix changed the title ~~JavaScript compilation for browsers is broken~~ JavaScript env for browsers is broken Nov 7, 2023

guybedford closed this as completed in #252 Nov 7, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

JavaScript env for browsers is broken #246

JavaScript env for browsers is broken #246

temeddix commented Nov 6, 2023 •

edited

Loading

temeddix commented Nov 6, 2023

temeddix commented Nov 6, 2023

yoshuawuyts commented Nov 6, 2023

temeddix commented Nov 6, 2023 •

edited

Loading

manekinekko commented Nov 6, 2023 •

edited

Loading

temeddix commented Nov 6, 2023 •

edited

Loading

temeddix commented Nov 6, 2023 •

edited

Loading

guybedford commented Nov 6, 2023

temeddix commented Nov 6, 2023 •

edited

Loading

JavaScript env for browsers is broken #246

JavaScript env for browsers is broken #246

Comments

temeddix commented Nov 6, 2023 • edited Loading

temeddix commented Nov 6, 2023

temeddix commented Nov 6, 2023

yoshuawuyts commented Nov 6, 2023

temeddix commented Nov 6, 2023 • edited Loading

manekinekko commented Nov 6, 2023 • edited Loading

temeddix commented Nov 6, 2023 • edited Loading

temeddix commented Nov 6, 2023 • edited Loading

guybedford commented Nov 6, 2023

temeddix commented Nov 6, 2023 • edited Loading

temeddix commented Nov 6, 2023 •

edited

Loading

temeddix commented Nov 6, 2023 •

edited

Loading

manekinekko commented Nov 6, 2023 •

edited

Loading

temeddix commented Nov 6, 2023 •

edited

Loading

temeddix commented Nov 6, 2023 •

edited

Loading

temeddix commented Nov 6, 2023 •

edited

Loading