elm / virtual-dom

The foundation of HTML and SVG in Elm.
https://package.elm-lang.org/packages/elm/virtual-dom/latest
BSD 3-Clause "New" or "Revised" License
209 stars 80 forks source link

Uncaught TypeError: domNode.replaceData is not a function #148

Open nikoudel opened 5 years ago

nikoudel commented 5 years ago

Hi! I'm having an issue which might belong here.

image

First, the app fails to render correctly - it's supposed to be like this:

image

Second, the app goes into an infinite loop when I click any of the links (the console errors).

This happens with a fresh Elm 0.19 install and the code from the example app on this guide page.

elm.json looks like this:

{
    "type": "application",
    "source-directories": [
        "src"
    ],
    "elm-version": "0.19.0",
    "dependencies": {
        "direct": {
            "elm/browser": "1.0.1",
            "elm/core": "1.0.2",
            "elm/html": "1.0.0",
            "elm/url": "1.0.0"
        },
        "indirect": {
            "elm/json": "1.1.2",
            "elm/time": "1.0.0",
            "elm/virtual-dom": "1.0.2"
        }
    },
    "test-dependencies": {
        "direct": {},
        "indirect": {}
    }
}

Note: the problem only appears in a certain Google Chrome instance (but not in IE or Firfox). Also the app works correctly when I run it in incognito mode in the same Chrome instance. And also it runs fine in another computer with the same Google Chrome version (70.0.3538.110) and the same addons. Disabling the addons doesn't help. Any ideas?

bitfella commented 5 years ago

Hi there. Do you have JSON Viewer Chrome extension installed? In my case that's what causes the issue. Disabled it and everything works just fine.

nikoudel commented 5 years ago

You are right! Disabling that extension helped. Didn't notice I had that extension installed on my main PC but not on the other.

I don't know though should I close this ticket or not... it would be kinda lame to tell app users to disable their extensions so they could use my site...

bitfella commented 5 years ago

I suppose you are using Elm Reactor to generate that code, as suggested in the docs. You should then generate production code with Elm Make and minify it. I guess production-ready code should not be affected by the kind of issue you opened. Give it a try!

nikoudel commented 5 years ago

Nope, that didn't work. I used uglifyjs as described here and updated the html file to load the minified version but enabling the JSON Viewer extension still breaks it.

edit: I'm not using Elm Reactor btw.

nikoudel commented 5 years ago

This issue is most likely caused by this bug in JSON Viewer.

A workaround is avoiding raw text without enclosing html elements, i.e. using span [] [ text "The current URL is: " ] instead of text "The current URL is: ".

Leaving for others to decide whether the Uncaught TypeError and the infinite loop thing can/should be still prevented in Elm.

Natim commented 5 years ago

Apparently Grammarly does that on Chrome as well

kubukoz commented 4 years ago

Dark Reader too. There goes a few hours of work... image