1233955 - Don't raise mouseover events when ajax content loaded and mouse movement

Status: NEW

(Core :: DOM: Events, defect, P5)

Description

[Sega100500]

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:43.0) Gecko/20100101 Firefox/43.0
Build ID: 20151216175450

Steps to reproduce:

I can't write English. Russian

Я занимаюсь разработкой веб-приложений, интернет-сайтов.

1. Есть элемент (дерево) для загрузки контента в другой элемент (DIV) с помощью ajax-запроса
2. При выборе одно из элементов в дереве загружается контент в DIV


Actual results:

При загрузке контента в соседний DIV (с помощью jQuery 2) происходит генерация события перемещения мыши внутри элемента, в который был загружен контент, хотя мышь все еще находится на элементе дерева.
mouseenter, mouseleave



Expected results:

Не должно генерироваться событие перемещения мыши, т.к. реально еще нет никаких перемещений внутри данного элемента.

Я проверял с помощью console.log()

В других браузерах (Chrome, Opera) подобное событие не генерируется.

Comment 1

[YF (Yang)]

Can you provide an example?

Comment 2

[Sega100500]

(In reply to YF (Yang) from comment #1)
> Can you provide an example?

http://landok.inet777.pro/admin

login: test
password: test

Menu: 'Контент'

Just switch between 'List 1' and 'List 2'
and see in console log window in browser
Move mouse in the lists - events are generated. It right! But only switching 'List 1' and 'List 2' generated in FireFox mouse events too. In Chrome - not.

Compare logs in FireFox and Chrome

in list JS code:

<script type="text/javascript">
  <!--
  //<![CDATA[

  if (typeof jQuery !== 'undefined') {
    $(document).ready(function () {

      console.log('List loaded by ajax');

      $('table.list').on('mouseenter', 'tr', function(e) {

        console.log('Event in list');
        console.log(e);

      });

    });

  }

  //]]>
  //-->
</script>

Comment 3

[Sega100500]

(In reply to YF (Yang) from comment #1)
> Can you provide an example?

You verify it?

Comment 4

[Sega100500]

Why only mouseenter?
I noticed this because tr:hover is happen (background color changed, and link within is active), then mouseleave probably rised, beacause tr, link becomes in normal state.

Comment 5

[Sega100500]

Change script:

<script type="text/javascript">
  <!--
  //<![CDATA[

  if (typeof jQuery !== 'undefined') {
    $(document).ready(function () {

      console.log('List loaded by ajax');

      $('table.list').on('mouseenter', 'tr', function(e) {

        console.log('Event enter in list');
        console.log(e);

      });

      $('table.list').on('mouseleave', 'tr', function(e) {

        console.log('Event leave in list');
        console.log(e);

      });

    });

  }

  //]]>
  //-->
</script>


Raised BOTH events. It only catched event... may be other raised too?

Comment 6

[YF (Yang)]

Before I did not see an mouseleave event log, so I did not confirm it. I guess it is not a necessary condition for reproduce and resolve the issue.

This testcase may require further confirmation and unraveling by expert, not me.

I seen the type:mouseover and type:mouseout in events details.

Comment 7

[Sega100500]

I verify one more moment.
This mouse events are catched by JQuery 2, but with jQuery 1 - not.

Comment 8

[Sega100500]

(In reply to Sega100500 from comment #7)
> I verify one more moment.
> This mouse events are catched by JQuery 2, but with jQuery 1 - not.

No. In jQuery 1 happends too. I'm sorry.

Comment 9

[Olli Pettay [:smaug][[e-mail]]]

Does anyone have a minimal testcase for this? Hopefully without jQuery since I'm sure it has browser specific code paths, but even a minimal testcase with jQuery (attached to this bug if possible) would be useful.

Comment 10

[Sega100500]

(In reply to Olli Pettay [:smaug] from comment #9)
> Does anyone have a minimal testcase for this? Hopefully without jQuery since
> I'm sure it has browser specific code paths, but even a minimal testcase
> with jQuery (attached to this bug if possible) would be useful.

jQuery in this case used for check for event occure. I see it when tr:hover activate and deactivate ("blink") without mouse move over tr.

Comment 11

[Sega100500]

I add 'List 3'. Switching between 'List 2' and 'List 3' is more more representative demonstration - can see moments when background of tr changed without inspecting console log.

Comment 12

[Sega100500]

With turned on of FireBug or Inspector it is more noticeable.
And by clicking on one element ('List 2' and 'List 3') many times (not switching) it is more noticeable.

Comment 13

[Sega100500]

The fact is that its events happens in FireFox only.
I verify Chrome, Opera, Internet Explorer - none of them are not happening.

Comment 14

[Jens Stutte [:jstutte]]

Bulk-downgrade of unassigned, 4 years untouched DOM/Storage bugs' priority.

If you have reason to believe this is wrong (especially for the severity), please write a comment and ni :jstutte.