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

Html.map with IE11: Unable to get property 'j' of undefined or null reference #167

Open
mbark opened this issue Mar 16, 2020 · 3 comments
Open

Comments

@mbark
Copy link

mbark commented Mar 16, 2020

Using Html.map for a view that conditionally renders text "" or some content with event listeners crashes in IE11 with the error below.

SCRIPT5007: Unable to get property 'j' of undefined or null reference
File: map.html, Line: 3000, Column: 10

This is not one of the problems mentioned in #105 I think, although it might be related to #101.

SSCE

I've created an example project. To reproduce:

  1. Build with elm make src/Main.elm;
  2. Open index.html in IE11;
  3. Click the "Show"-button and then the "Hide 'modal'"-button.

This will trigger the error in the console and the onClick event won't be triggered.

Details

  • It only occurs in IE11, in Firefox and Chrome it works fine.
  • It only happens if the mapped view function has text "" at the first render (i.e. setting mapped = True in the init function in the example won't trigger the error).

Motivation

The reason we run into this problem is that we have want to conditionally render modals and we want to render these as high up in the DOM as possible to avoid stacking context problems. So do do this we have two view functions, one which renders whatever content is on the page and one for the modal which is conditionally rendered.

Workaround

The problem is very easy to work around, just return a div [] [] instead of text "", which is what we have done for now.

@Pilatch
Copy link

Pilatch commented Apr 13, 2020

I tested this locally in IE 11, and can also confirm that it is, indeed, a bug that causes a runtime exception.

@Pilatch
Copy link

Pilatch commented Apr 13, 2020

It comes down to this code resulting in undefined.

var currentEventNode = ( stopPropagation && event.stopPropagation(), (tag == 2 ? value.b : tag == 3 && value.preventDefault) && event.preventDefault(), eventNode );

@atzzCokeK
Copy link

atzzCokeK commented Jul 31, 2020

@mbark
Hi, thank you for your contribution. This bug happens in our product. We found a span [] [] also works well instead of text "" .

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants