Bug 27446 - Web Inspector breaks some js dropdown menus
Summary: Web Inspector breaks some js dropdown menus
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (Deprecated) (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P3 Normal
Assignee: Nobody
URL:
Keywords: HasReduction
Depends on:
Blocks:
 
Reported: 2009-07-20 07:56 PDT by Pavel Feldman
Modified: 2014-12-15 23:43 PST (History)
5 users (show)

See Also:


Attachments
Reduced testcase (1.59 KB, text/html)
2009-08-02 07:31 PDT, Jerome Leclanche
no flags Details
Further reduced test case (64 bytes, text/plain)
2009-08-02 08:59 PDT, Daniel Upstone
no flags Details
Further reduced test case file (834 bytes, application/xhtml+xml)
2009-08-02 09:04 PDT, Daniel Upstone
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Pavel Feldman 2009-07-20 07:56:18 PDT
What steps will reproduce the problem?
1. Go to http://db.mmo-champion.com/
2. Open the Web Inspector
3. Hover the links under the search box

What is the expected result?
Dropdown menus should be shown

What happens instead?
The menus stack all together

(upstreamed from Chromium http://code.google.com/p/chromium/issues/detail?id=16949)
Comment 1 Jerome Leclanche 2009-08-02 04:45:43 PDT
I'm going to go with my instinct:

The hover creates a menu. This menu is an <ul>; the ul is a child of an <a> tag. This is very broken html.

I'm going to try make a reduced testcase this afternoon.
Comment 2 Jerome Leclanche 2009-08-02 06:52:21 PDT
Okay, two notes:
- The behaviour on the linked page happens *all the time* with the web inspector open, and *rarely* with the web inspector closed.
- While reducing, I was able to come up with a test case that would *always* reproduce the problem even with the web inspector closed.

It might be safe to change the bug's component.

Cleaning up and attaching the testcase.
Comment 3 Jerome Leclanche 2009-08-02 07:31:41 PDT
Created attachment 33952 [details]
Reduced testcase

There's the "cleaned up" reduced testcase. The web inspector no longer needs to be opened to reproduce.
Tested against firefox 3.0 and 3.5.
Comment 4 Daniel Upstone 2009-08-02 08:18:20 PDT
To clarify the issue...
The <ul> is removed and added by javascript as a child of a <span> element (not <a>). This is of course "bad html" as it's a block element inside an inline element.

The bug is that the line breaks created by the <ul> being display: block aren't removed when the <ul> is. Changing to the <ul> to display: inline before removing the <ul> removes the line breaks first, preventing the bug from appearing.

I don't know if this effects other block elements used within inline elements.
Comment 5 Daniel Upstone 2009-08-02 08:59:47 PDT
Created attachment 33953 [details]
Further reduced test case

Reduced javascript, number of elements and type of elements.
Comment 6 Daniel Upstone 2009-08-02 09:04:32 PDT
Created attachment 33954 [details]
Further reduced test case file

Reduced javascript, number of elements and type of elements. Uploaded test case file.
Comment 7 Jerome Leclanche 2009-10-28 08:41:56 PDT
+HasReduction please.
Comment 8 Jerome Leclanche 2012-01-26 07:15:14 PST
Still in 535.18.
Comment 9 Alexander Pavlov (apavlov) 2012-10-11 06:47:53 PDT
The behavior in WebKit r131018 matches that in FireFox 15.0.1 - please double-check and close the bug if appropriate.
Comment 10 Jerome Leclanche 2012-10-11 07:29:10 PDT
(In reply to comment #9)
> The behavior in WebKit r131018 matches that in FireFox 15.0.1 - please double-check and close the bug if appropriate.

Looks fixed.