search

rails / importmap-rails

Use ESM with importmap to manage modern JavaScript in Rails without transpiling or bundling.
MIT License
1.03k stars 110 forks source link

Breaking after upgrade to Chrome 103 #137

Closed woodardj closed 1 year ago

woodardj commented 2 years ago

I just upgraded to Chrome Version 103.0.5060.53 (Official Build) (arm64) after getting reports from one of my users that my app was having Javascript issues. I wasn't able to recreate before upgrading.

I'm on importmap-rails 1.1.2 and here's what I get in the console:

Screen Shot 2022-06-29 at 08 09 53 
An import map is added after module script load was triggered.
Uncaught TypeError: Failed to resolve module specifier "application". Relative references must start with either "/", "./", or "../".
GET http://0.0.0.0:3000/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js net::ERR_ABORTED 500 (Internal Server Error)
woodardj commented 2 years ago

I just re-read https://github.com/rails/importmap-rails/issues/28 and tested this again in a new Chrome profile with no installed Extensions, and same result.

Screen Shot 2022-06-29 at 08 18 44 Screen Shot 2022-06-29 at 08 19 10
guybedford commented 1 year ago

This is typically caused by having module preload tags or module script tags before the import map in the HTML document. Perhaps share the HTML output you are getting here.

digitalronin commented 1 year ago

I'm getting the same problem after upgrading Chrome.

Here's my HTML for the head of the page. The importmap entry is the first script tag.

<!DOCTYPE html>
<html>
  <head>
    <title>Foobar</title>
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="ZlXjPy-JUKg1qiX2y4nkr4p_GksQmFAz6DWH5ESHZ1GgW1FH2QhS2KdJphV0ni0tOz-Pj3NiRdnmDKXvDRAwxA" />

    <link rel="stylesheet" href="/assets/tailwind-08dd757bf3fc885023bf4d0622a2348730f06279292033e353f85c849810c6a8.css" data-turbo-track="reload" />
<link rel="stylesheet" href="/assets/inter-font-8c3e82affb176f4bca9616b838d906343d1251adc8408efe02cf2b1e4fcf2bc4.css" data-turbo-track="reload" />

    <link rel="stylesheet" href="/assets/application-fe440406e54bdd95ec9046fd7f7b3f6803f9748857226012c8213a74c8350ae1.css" data-turbo-track="reload" />
    <script type="importmap" data-turbo-track="reload">{
  "imports": {
    "application": "/assets/application-37f365cbecf1fa2810a8303f4b6571676fa1f9c56c248528bc14ddb857531b95.js",
    "@hotwired/turbo-rails": "/assets/turbo.min-e5023178542f05fc063cd1dc5865457259cc01f3fba76a28454060d33de6f429.js",
    "@hotwired/stimulus": "/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js",
    "@hotwired/stimulus-loading": "/assets/stimulus-loading-1fc59770fb1654500044afd3f5f6d7d00800e5be36746d55b94a2963a7a228aa.js",
    "@rails/ujs": "https://ga.jspm.io/npm:@rails/ujs@6.0.5/lib/assets/compiled/rails-ujs.js",
    "controllers/application": "/assets/controllers/application-368d98631bccbf2349e0d4f8269afb3fe9625118341966de054759d96ea86c7e.js",
    "controllers/hello_controller": "/assets/controllers/hello_controller-549135e8e7c683a538c3d6d517339ba470fcfb79d62f738a0a089ba41851a554.js",
    "controllers/home_controller": "/assets/controllers/home_controller-54b5b18fd074d352d1ff5162c0d7ae624247750bb8c5fab21c6fb0802fb56372.js",
    "controllers": "/assets/controllers/index-2db729dddcc5b979110e98de4b6720f83f91a123172e87281d5a58410fc43806.js"
  }
}</script>
<link rel="modulepreload" href="/assets/application-37f365cbecf1fa2810a8303f4b6571676fa1f9c56c248528bc14ddb857531b95.js">
<link rel="modulepreload" href="/assets/turbo.min-e5023178542f05fc063cd1dc5865457259cc01f3fba76a28454060d33de6f429.js">
<link rel="modulepreload" href="/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js">
<link rel="modulepreload" href="/assets/stimulus-loading-1fc59770fb1654500044afd3f5f6d7d00800e5be36746d55b94a2963a7a228aa.js">
<script src="/assets/es-module-shims.min-b8099fffdbd758070d4801321d43b389c5b6174a50782f9f4cb57061533b7ac2.js" async="async" data-turbo-track="reload"></script>
<script type="module">import "application"</script>
    <script src="/assets/turbo-75fdf390d33bd1a4dcbba67f94d1c3ec9257fc8b8437b17a1999a61a8ebe3718.js" type="module"></script>
    <script src="/vite-dev/@vite/client" type="module"></script>
    <script src="/vite-dev/entrypoints/application.js" crossorigin="anonymous" type="module"></script>
    <!--
      If using a TypeScript entrypoint file:
        vite_typescript_tag 'application'

      If using a .jsx or .tsx entrypoint, add the extension:
        vite_javascript_tag 'application.jsx'

      Visit the guide for more information: https://vite-ruby.netlify.app/guide/rails
    -->

  </head>
woodardj commented 1 year ago

Here's my HTML:

<!DOCTYPE html>
<html>
  <head>

    <title>Galactic Impact &ndash; Galaxy Map</title>
    <link href="https://fonts.googleapis.com/css2?family=Abel&family=Inconsolata&display=swap" rel="stylesheet">
    <link rel="icon" type="image/x-icon" href="[/assets/ships/enemy-chit-ae6911a766411c5029d155b40fc8c8bb516a11202fd8e6b29ccdd2fbf34c07fc.png](http://0.0.0.0:3000/assets/ships/enemy-chit-ae6911a766411c5029d155b40fc8c8bb516a11202fd8e6b29ccdd2fbf34c07fc.png)" />
    <meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="0nIUbyMneDfq2FixIlO2vpg28J-M-AbECNthhRcaE4ZUxIpzNed8F__BOF4FP5hlWVvFPK7z0h91sze8Tsl64A" />

    <script type="importmap" data-turbo-track="reload">{
  "imports": {
    "application": "/assets/application-415174542d74f025f8a59476987544eeb6e3bb36b11b134764c9a9d9c84255e4.js",
    "technologies": "/assets/technologies-e1bc0103d9352035e126cf37a429f9e8e6b5d76f948c5aa9526df4fcfd1c7be5.js",
    "onboarding": "/assets/onboarding-f05915df171a673fa6aba634e7379de5cc3c01f232d8ea20a9f419e76c4e4b48.js",
    "subscription": "/assets/subscription-2eae7dad7321bdbf2596718a046a3e9ec15a27a887308bd6ed7ad9e38eacf572.js",
    "@rails/ujs": "https://ga.jspm.io/npm:@rails/ujs@6.1.5/lib/assets/compiled/rails-ujs.js",
    "stimulus": "https://ga.jspm.io/npm:stimulus@3.0.1/dist/stimulus.js",
    "@hotwired/stimulus": "/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js",
    "@hotwired/stimulus-loading": "/assets/stimulus-loading-1fc59770fb1654500044afd3f5f6d7d00800e5be36746d55b94a2963a7a228aa.js",
    "@rails/actioncable": "https://ga.jspm.io/npm:@rails/actioncable@6.1.5/app/assets/javascripts/action_cable.js",
    "controllers/tabular/action": "/assets/controllers/tabular/action-a00f96a85a8ff2556e70f75d9dabbbc52bb2f8d86df8f426a186346a6deb9b5f.js",
    "controllers/tabular/tab_state": "/assets/controllers/tabular/tab_state-d59169fb1326c656611bf5aa00f7e335394d515581aabd7b66963aeb1038c357.js",
    "lodash": "https://ga.jspm.io/npm:lodash@4.17.21/lodash.js",
    "form-request-submit-polyfill": "https://ga.jspm.io/npm:form-request-submit-polyfill@2.0.0/form-request-submit-polyfill.js",
    "store2": "https://ga.jspm.io/npm:store2@2.13.2/dist/store2.js",
    "sortablejs": "https://ga.jspm.io/npm:sortablejs@1.15.0/modular/sortable.esm.js",
    "cytoscape": "https://ga.jspm.io/npm:cytoscape@3.21.1/dist/cytoscape.cjs.js",
    "heap": "https://ga.jspm.io/npm:heap@0.2.7/index.js",
    "lodash.debounce": "https://ga.jspm.io/npm:lodash.debounce@4.0.8/index.js",
    "lodash.get": "https://ga.jspm.io/npm:lodash.get@4.4.2/index.js",
    "lodash.set": "https://ga.jspm.io/npm:lodash.set@4.3.2/index.js",
    "lodash.topath": "https://ga.jspm.io/npm:lodash.topath@4.5.2/index.js",
    "process": "https://ga.jspm.io/npm:@jspm/core@2.0.0-beta.21/nodelibs/browser/process-production.js",
    "cytoscape-popper": "https://ga.jspm.io/npm:cytoscape-popper@2.0.0/cytoscape-popper.js",
    "@popperjs/core": "https://ga.jspm.io/npm:@popperjs/core@2.11.5/lib/index.js",
    "@jsplumb/browser-ui": "https://ga.jspm.io/npm:@jsplumb/browser-ui@5.5.5/js/jsplumb.browser-ui.es.js",
    "@jsplumb/common": "https://ga.jspm.io/npm:@jsplumb/common@5.5.5/js/jsplumb.common.es.js",
    "@jsplumb/core": "https://ga.jspm.io/npm:@jsplumb/core@5.5.5/js/jsplumb.core.es.js",
    "@jsplumb/util": "https://ga.jspm.io/npm:@jsplumb/util@5.5.5/js/jsplumb.util.es.js",
    "@stripe/stripe-js": "https://ga.jspm.io/npm:@stripe/stripe-js@1.27.0/dist/stripe.esm.js",
    "chart.js": "https://cdn.jsdelivr.net/npm/chart.js@3.7.1/dist/chart.esm.js",
    "jquery": "https://ga.jspm.io/npm:jquery@3.6.0/dist/jquery.js",
    "controllers/application": "/assets/controllers/application-368d98631bccbf2349e0d4f8269afb3fe9625118341966de054759d96ea86c7e.js",
    "controllers/auto_submit_controller": "/assets/controllers/auto_submit_controller-a5c360db88a25e6e2e57dca12d742f0c530fa0949a98e534ce3ced5437a90882.js",
    "controllers/chart_controller": "/assets/controllers/chart_controller-46b8c696c71eccbb34833ea82de5368128931e7569e421b10daad89c9e0e153d.js",
    "controllers/combat_controller": "/assets/controllers/combat_controller-8b2ae68084a058c5825a0d480436741462bfc69891a030d7120b4272f2c73a65.js",
    "controllers/dialog_controller": "/assets/controllers/dialog_controller-f36871710cd3efaae2c4b6b28e5d1844b5ad89040de2b254e0704196e8ae8da9.js",
    "controllers/disambiguate_controller": "/assets/controllers/disambiguate_controller-85051d311cbb9aba07ec7bffe5a9fb7228b13baaab1fa5bc8ceb259573c0aec7.js",
    "controllers/filter_controller": "/assets/controllers/filter_controller-a5035f0c4c21a0fee21cef6a401c72a53ce5622263d08ec54b4f2e76abd3e50e.js",
    "controllers/foundry_controller": "/assets/controllers/foundry_controller-961a4f2489a7d00f7d9e597b483a783e25eb0d4e8bbe7ad78c3fe6b6904f698e.js",
    "controllers/galaxy_controller": "/assets/controllers/galaxy_controller-9141fede2a634eece0c76ecc1ec8ce7195ebadf4504cd7f2b9bceaa681516c7c.js",
    "controllers/hyperselect_controller": "/assets/controllers/hyperselect_controller-b5d2921cbb037c5b051e67ff007e4cdddbef57c24a3be670bcd2ee91c93cc1cd.js",
    "controllers": "/assets/controllers/index-e25d830fa8fb2f7a7981d4a8d30790dd5ae0c8d01e7709e5ad011b45dcbe0122.js",
    "controllers/pickwhip_controller": "/assets/controllers/pickwhip_controller-478052199a58b8b383ec3aa9d5624c7aa2deed3a726318d4fa4f3c469a92c1a6.js",
    "controllers/prioritize_controller": "/assets/controllers/prioritize_controller-dbd0a1bd3c16a43f555fe8a7987a320392fb1c73b6249c257ed44e228decff8f.js",
    "controllers/roster_controller": "/assets/controllers/roster_controller-63622ad4586b4e8e83f19b62e58aea1a082c66a15d4a84def9182dfa79161cbc.js",
    "controllers/ship_command_controller": "/assets/controllers/ship_command_controller-fb427b4bf123b769823dc1128795eec2453591e9ede9df188f5705b680985708.js",
    "controllers/sightings_controller": "/assets/controllers/sightings_controller-3fff7b1c9b1cabac7d15ea72c8ae7cb687d2356592720d6e610b2506381fde96.js",
    "controllers/sort_controller": "/assets/controllers/sort_controller-9a011bd3dbf11ff7ced96ba3eb7792367145b62f1efd01acd5c62e7107c6826e.js",
    "controllers/tabular/tabs_controller": "/assets/controllers/tabular/tabs_controller-acaf95da7bfc8dd9281b36b7edc44f8c018b364691cdd2717afc992189049a14.js",
    "controllers/timer_controller": "/assets/controllers/timer_controller-d09b0277b49ad24ce5bc62d14fdbb2a511449d6fa45dbdc4f674ff40272ed3c7.js",
    "controllers/tutorial_controller": "/assets/controllers/tutorial_controller-60b52740ea4ed3fcb4050f94e059b64d4b8c18be731165d79ef60a57a96391d3.js",
    "controllers/upsell_controller": "/assets/controllers/upsell_controller-6956b4bd16955a0beb7081aacb63ba032c8902484374e96edf5a5b21b377cd32.js"
  }
}</script>
<link rel="modulepreload" href="[/assets/application-415174542d74f025f8a59476987544eeb6e3bb36b11b134764c9a9d9c84255e4.js](http://0.0.0.0:3000/assets/application-415174542d74f025f8a59476987544eeb6e3bb36b11b134764c9a9d9c84255e4.js)">
<link rel="modulepreload" href="[/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js](http://0.0.0.0:3000/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js)">
<link rel="modulepreload" href="[/assets/stimulus-loading-1fc59770fb1654500044afd3f5f6d7d00800e5be36746d55b94a2963a7a228aa.js](http://0.0.0.0:3000/assets/stimulus-loading-1fc59770fb1654500044afd3f5f6d7d00800e5be36746d55b94a2963a7a228aa.js)">
<script src="[/assets/es-module-shims.min-b8099fffdbd758070d4801321d43b389c5b6174a50782f9f4cb57061533b7ac2.js](http://0.0.0.0:3000/assets/es-module-shims.min-b8099fffdbd758070d4801321d43b389c5b6174a50782f9f4cb57061533b7ac2.js)" async="async" data-turbo-track="reload"></script>
<script type="module">import "application"</script>
    <script src="[/assets/turbo-7b0aa11f61631e9e535944fe9c3eaa4186c9df9d6c9d8b1d16a1ed3d85064cf0.js](http://0.0.0.0:3000/assets/turbo-7b0aa11f61631e9e535944fe9c3eaa4186c9df9d6c9d8b1d16a1ed3d85064cf0.js)" type="module"></script>
    <link rel="stylesheet" href="[/assets/application-c794d7360a043b0f0ea41da80cbb03a42b2b392dbc3581bcedd0938e33c46afc.css](http://0.0.0.0:3000/assets/application-c794d7360a043b0f0ea41da80cbb03a42b2b392dbc3581bcedd0938e33c46afc.css)" media="all" data-turbolinks-track="reload" />

  </head>
guybedford commented 1 year ago

These HTML outputs don't demonstrate the issue unfortunately. This might be because of differences between the view source and what is actually happening so it might also help to debug here to check the actual HTML that is being executed from the document.body.parentNode.innerHTML string the dev console gives. Another thing that might be worth trying is removing the "modulepreload" link tags if possible.

digitalronin commented 1 year ago

Here's the head part of the HTML from document.body.parentNode.innerHTML. I've replaced the \n with newlines to make it readable. Other than that, it's as copied from the developer tools console.

I can see that only the script tags have the opening < as \x3C - all the other tags look normal. Could that have anything to do with the problem, or is that just an artifact of viewing the html in this way?

removing the "modulepreload" link tags

Those are being generated by this line in my layout:

    <%= javascript_importmap_tags %>

If I remove that line, the modulepreload lines are not generated, and I don't see those errors in the javascript console, but stimulus is still broken.

For clarity, the html below comes from the normal layout, with the <%= javascript_importmap_tags %> in place.

`<head><style type="text/css">.turbo-progress-bar {
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  height: 3px;
  background: #0076ff;
  z-index: 9999;
  transition:
    width 300ms ease-out,
    opacity 150ms 150ms ease-in;
  transform: translate3d(0, 0, 0);
}
</style>
    <title>Foobar</title>
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="csrf-param" content="authenticity_token">
<meta name="csrf-token" content="-ivEIjR7wVq_O5EfMxwMOIiO2iGinFTgr1GXnL_J_Ugps0WWqxQ6aIraE_sJkSaJwolsVqcgbQcD67QGckqs8Q">

    <link rel="stylesheet" href="/assets/tailwind-08dd757bf3fc885023bf4d0622a2348730f06279292033e353f85c849810c6a8.css" data-turbo-track="reload">
<link rel="stylesheet" href="/assets/inter-font-8c3e82affb176f4bca9616b838d906343d1251adc8408efe02cf2b1e4fcf2bc4.css" data-turbo-track="reload">

    <link rel="stylesheet" href="/assets/application-fe440406e54bdd95ec9046fd7f7b3f6803f9748857226012c8213a74c8350ae1.css" data-turbo-track="reload">
    \x3Cscript type="importmap" data-turbo-track="reload">{
  "imports": {
    "application": "/assets/application-37f365cbecf1fa2810a8303f4b6571676fa1f9c56c248528bc14ddb857531b95.js",
    "@hotwired/turbo-rails": "/assets/turbo.min-e5023178542f05fc063cd1dc5865457259cc01f3fba76a28454060d33de6f429.js",
    "@hotwired/stimulus": "/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js",
    "@hotwired/stimulus-loading": "/assets/stimulus-loading-1fc59770fb1654500044afd3f5f6d7d00800e5be36746d55b94a2963a7a228aa.js",
    "@rails/ujs": "https://ga.jspm.io/npm:@rails/ujs@6.0.5/lib/assets/compiled/rails-ujs.js",
    "controllers/application": "/assets/controllers/application-368d98631bccbf2349e0d4f8269afb3fe9625118341966de054759d96ea86c7e.js",
    "controllers/hello_controller": "/assets/controllers/hello_controller-549135e8e7c683a538c3d6d517339ba470fcfb79d62f738a0a089ba41851a554.js",
    "controllers/home_controller": "/assets/controllers/home_controller-5ac2c66ae57882ef68d2797ddb7af8de22748bba92e00068c1dab9e9e5456499.js",
    "controllers": "/assets/controllers/index-2db729dddcc5b979110e98de4b6720f83f91a123172e87281d5a58410fc43806.js"
  }
}\x3C/script>
<link rel="modulepreload" href="/assets/application-37f365cbecf1fa2810a8303f4b6571676fa1f9c56c248528bc14ddb857531b95.js">
<link rel="modulepreload" href="/assets/turbo.min-e5023178542f05fc063cd1dc5865457259cc01f3fba76a28454060d33de6f429.js">
<link rel="modulepreload" href="/assets/stimulus.min-900648768bd96f3faeba359cf33c1bd01ca424ca4d2d05f36a5d8345112ae93c.js">
<link rel="modulepreload" href="/assets/stimulus-loading-1fc59770fb1654500044afd3f5f6d7d00800e5be36746d55b94a2963a7a228aa.js">
\x3Cscript src="/assets/es-module-shims.min-b8099fffdbd758070d4801321d43b389c5b6174a50782f9f4cb57061533b7ac2.js" async="async" data-turbo-track="reload">\x3C/script>
\x3Cscript type="module">import "application"\x3C/script>
    \x3Cscript src="/assets/turbo-75fdf390d33bd1a4dcbba67f94d1c3ec9257fc8b8437b17a1999a61a8ebe3718.js" type="module">\x3C/script>

    \x3Cscript src="/vite/assets/application.ff486227.js" crossorigin="anonymous" type="module">\x3C/script>
    \x3C!--
      If using a TypeScript entrypoint file:
        vite_typescript_tag 'application'

      If using a .jsx or .tsx entrypoint, add the extension:
        vite_javascript_tag 'application.jsx'

      Visit the guide for more information: https://vite-ruby.netlify.app/guide/rails
    -->

  </head>
digitalronin commented 1 year ago

I've created a repo to demonstrate this problem on a clean rails app. running in a self-contained docker compose environment.

The issue occurs with this commit that adds the <%= turbo_include_tags %> line to the layout.

Without that line, the stimulus controller works fine. Add that line, and this issue appears.

@guybedford Does this help narrow down the problem at all?

guybedford commented 1 year ago

@digitalronin I'm sorry but I have no idea how to run that replication - I'd need an exact set of commands I can run on windows with docker installed, and couldn't work out what that would be from the readme.

digitalronin commented 1 year ago

@guybedford No worries. I've updated the README with explicit docker compose commands.

I'm on a mac, so I'm not certain if these will work on windows or not, but please give it a try.

guybedford commented 1 year ago

@digitalronin finally got back around to trying this, but unfortunately it still fails on the second docker compose step and bails:

#0 2.663 Reading package lists...
#0 2.942 Building dependency tree...
#0 3.024 Reading state information...
#0 3.035 Calculating upgrade...
#0 3.141 0 upgraded, 0 newly installed, 0 to remove and 0 not upgraded.
#0 3.147 Reading package lists...
#0 3.424 Building dependency tree...
#0 3.504 Reading state information...
#0 3.547 E: Unable to locate package vim
digitalronin commented 1 year ago

@guybedford That's really odd. I don't have access to a windows machine, so I can't test it myself. I'm not sure why the base image would already contain vim on OSX but not on windows - that doesn't seem right.

I've added an explicit install for vim with this commit. Could you give it one more try, please?

guybedford commented 1 year ago

That doesn't resolve it unfortunately. It's this line - https://github.com/digitalronin/importmap-rails-issue-137/blob/main/.dockerdev/Dockerfile#L50.

digitalronin commented 1 year ago

Ah, of course. I forgot where vim was coming from.

I have no idea why that wouldn't work, but it's not necessary anyway - the only thing that whole section does, in this case, is install vim. Since we're now doing that separately anyway, I've just committed a change to comment out that whole section.

Would you mind giving it one last try @guybedford ?

guybedford commented 1 year ago

@digitalronin the next issue I get is then on the following command:

docker compose --file .dockerdev/compose.yml --project-name foobar-application run --no-deps --rm rails /bin/bash -c bin/setup
/usr/bin/env: ‘ruby\r’: No such file or directory
digitalronin commented 1 year ago

I did reply to this at the time, but I see my message didn't reach this thread for some reason.

I think that's a problem related to windows vs. unix line endings. It looks as if 'env' is trying to find the installed version of 'ruby\r' rather than 'ruby'.

I have no idea how to fix that, I'm afraid.

woodardj commented 1 year ago

@digitalronin thanks for bringing this thread back into my inbox — I just did some additional digging, and following the deprecation note here: https://rubydoc.info/github/hotwired/turbo-rails/Turbo/IncludesHelper cleared up the problem for me, swapping turbo_include_tags with javascript_include_tag 'turbo', type: 'module-shim' in my layout 🎉

[Edit: This appears to have broken in Firefox now]

digitalronin commented 1 year ago

I think that's a problem related to windows vs. unix line endings. It looks as if 'env' is trying to find the installed version of 'ruby\r' rather than 'ruby'.

I have no idea how to fix that, I'm afraid.

On Mon, 25 Jul 2022 at 11:35, Guy Bedford @.***> wrote:

@digitalronin https://github.com/digitalronin the next issue I get is then on the following command:

docker compose --file .dockerdev/compose.yml --project-name foobar-application run --no-deps --rm rails /bin/bash -c bin/setup

/usr/bin/env: ‘ruby\r’: No such file or directory

— Reply to this email directly, view it on GitHub https://github.com/rails/importmap-rails/issues/137#issuecomment-1193490432, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAASIXGC2ZYOB6BBVDGN6DVVX4PFANCNFSM52F7AQGA . You are receiving this because you were mentioned.Message ID: @.***>

woodardj commented 1 year ago

The following configuration finally worked for me in all browsers:

Screen Shot 2023-04-04 at 07 09 54

I found that with the include tag set to "module-shim", it worked only in Chrome and Edge, with it set to "module" it worked only in Safari and Firefox.

Setting it to "module" and moving above javascript_importmap_tags worked across the board. Not sure why, but glad I tried it.