Lost click event if :focus selector adds :after element

UNCONFIRMED
Unassigned

Status

()

UNCONFIRMED
3 years ago
3 years ago

People

(Reporter: okrasz_news, Unassigned)

Tracking

42 Branch
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(URL)

(Reporter)

Description

3 years ago
User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:42.0) Gecko/20100101 Firefox/42.0
Build ID: 20151029151421

Steps to reproduce:

http://jsfiddle.net/tm69s9ot/2/

Try clicking text within yellow dashed area of the buttons on the left and right.

More technical:
1. Create element with click handler, relatively positioned (<a> in this sample)
2. Add additional element inside (<span> with text in this sample)
3. Add :focus:after style which is absolutely positioned and covering the outer element (<a>, green area)
4. Click the internal element (in this case yellow area in dashed border, <span>)


Actual results:

The first click within internal element (yellow area) is lost - counter value is not increased. If you click of the second time into the same area, the event will arrive and increase counter. You can click the areas (yellow in dashed border) between two buttons many times and no event will come --> counter won't be incremented. 

If you click green area (between dashed and solid border) the events will always arrive and increment the counter. 


Expected results:

Each click within the element with click handler should trigger click event, regardless click is on the internal element our outside (yellow or green area).

Chrome and Internet Explorer 11 works this way.
You need to log in before you can comment on or make changes to this bug.