virtual-dom icon indicating copy to clipboard operation
virtual-dom copied to clipboard

Fixes #103 Html.map + blur event on DOM removal makes impossible states possible

Open decioferreira opened this issue 5 years ago • 7 comments

Updated SSCCE: https://ellie-app.com/8cPfM8xMj7Za1

This issue happens in chrome, and not firefox (as mentioned on #103). To see the issue on the SSCCE above:

  • press "Go to B"
  • look at the Logs
  • impossible message MsgB BlurA triggered by the blur event

More details about the problem can be found on #103.

This should also fix elm/html#119 as mentioned on #105.

decioferreira avatar Mar 04 '20 11:03 decioferreira

@decioferreira This PR misses the case when no Html.map is used. In that case, eventNode is the sendToMap function. A version that accounts for that is:


			var oldHandler = oldCallback.__handler;
			if (oldHandler.$ === newHandler.$)
			{
				oldCallback.__handler = newHandler;
				oldCallback.__eventNode = eventNode.__tagger ? {
					__tagger: eventNode.__tagger,
					__parent: eventNode.__parent
				} : eventNode;
				continue;
			}
			domNode.removeEventListener(key, oldCallback);

// and

	callback.__handler = initialHandler;
	callback.__eventNode = eventNode.__tagger ? { __tagger: eventNode.__tagger, __parent: eventNode.__parent } : eventNode;

	return callback;

matsjoyce avatar Aug 31 '20 20:08 matsjoyce

hi @matsjoyce, thank you so much for your comment. Any chance you could share an SSCCE which shows the problem that your change would allow to fix? thanks in advance

decioferreira avatar Aug 31 '20 22:08 decioferreira

With the following code, click on the input and then somewhere else (focus then unfocus).

module Main exposing (main)

import Html as H
import Html.Events as HE
import Browser

type alias Model = {}
type Msg = Blurred

main =
    Browser.sandbox
        { init = {}
        , update = update
        , view = view
        }

update msg model = {}

view model = H.input [HE.onBlur Blurred] []

In the console I get:

Test.elm:3005 Uncaught TypeError: currentEventNode is not a function
    at HTMLInputElement.callback (Test.elm:3005)
callback @ Test.elm:3005

matsjoyce avatar Sep 01 '20 09:09 matsjoyce

@matsjoyce I've updated the code with your fix, thank you!

decioferreira avatar Sep 01 '20 21:09 decioferreira

Thanks for opening this @decioferreira. This has been affecting us as well. How have you addressed the problem in the meantime?

cmditch avatar May 03 '22 20:05 cmditch

@cmditch,

How have you addressed the problem in the meantime?

Some workaround seems available at https://github.com/elm/virtual-dom/issues/103

lucamug avatar May 03 '22 20:05 lucamug

Just a note: I experience this bug only in Safari now, not Chrome or Firefox (with a Mouse Leave event)

thomasin avatar Jan 06 '23 12:01 thomasin