[Webkit-unassigned] [Bug 14524] Inspector should be usable as a reduction engine

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Thu May 15 15:22:14 PDT 2008


------- Comment #5 from ddkilzer at webkit.org  2008-05-15 15:22 PDT -------
Created an attachment (id=21184)
 --> (http://bugs.webkit.org/attachment.cgi?id=21184&action=view)
Stand-alone tool for reducing bugs

Here's a WIP copy of a tool (a web page) that works on a certain class of test
case reductions, e.g., ones that you can easily write a test for using
JavaScript.  Repaint issues would not work (because you can't tell if the
repaint failed via JavaScript), but "an element is misplaced on the page" or
"an element is too big/too small" issues work well.

Here's how to use it.

1. Save as "Page Source" the page you want to reduce into the same directory as
2. Edit pageSource.html to add a <base href=""> tag with the original URL of
the page.
3. Edit <iframe> at bottom of index.html to point to pageSource.html.
4. Edit pageSource.html to add id attributes to "interesting" elements.
5. Open index.html (through a web server or through the file system) in Safari.
6. Write JavaScript code to test for the interesting condition you're seeing. 
(I've used offsetTop and offsetLeft with a lot of success to verify the
relative position of two elements that I suspect are involved.)  Notes:
- The "document" variable is the document for the iframe, not the document for
- If you don't want a node (element or text) to disappear, add a check for it
in the test function to make sure false is returned if it's not found in the
7. Use the "Verify Test" button to make sure your JavaScript test returns true
for the existing web page.

At this point, you have 3 tools that may be used multiple times in any order to
reduce a web page:  "Run Child Node Delta", "Run Tree Node Delta" and "Run
StyleSheet Delta".  The "View HTML" button pops a JavaScript alert with the
current contents of the iframe which you may cut/paste after selecting all
(even if it runs off the screen).

"Run Child Node Delta"
This button walks the DOM attempting to remove all child nodes at levels N to M
below the document root (<html>) where "N" is the starting level and "M" is the
maximum tree depth of the DOM.  It starts at the value in the "Level" input
box, so if you've run it once, you'll need to reset it to 1 (or whatever) to
run it again.  (Obviously, it only removes the node if the test() method
returns true.)

This was the original tool I wrote and works fairly well.  You tend to be left
with large single-branch trees due to the nature of the reductions, but those
are easily reduced by hand.

Also note that sometimes removing style/link elements will not trigger proper
redraws, so it's useful to start at Level "3" or "4" if the resulting reduction
doesn't reproduce when you reload it.

"Run Tree Node Delta"
This button attempts to reduce the tree depth by removing nodes who have only a
single child.  It doesn't work very well; perhaps it needs to walk child nodes
from the bottom of the tree up, or be more intelligent about removing some
types of nodes (like tables).

"Run StyleSheet Delta"
This button "flattens" stylesheets used in an HTML document, and replaces all
<link> and <style> nodes with local copies of the rules.  Then it iterates
through all rules in all stylesheets attempting to remove them as long as the
test() method still returns true.

When you think the tool has done as much as it can, use the "View HTML" button
and copy/paste the HTML into a local file for further reduction.  (Yes, you can
actually copy/paste HTMl from the JavaScript dialog in Safari.  Opening a new
window with the source would be a bit nicer.)

I've used it to reduce test cases for these bugs already:


My git repo hash: c00c22539450c2f2b4691b9aaefd779d503516ca

Configure bugmail: http://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug, or are watching the assignee.

More information about the webkit-unassigned mailing list