Closed
Bug 364705
Opened 19 years ago
Closed 19 years ago
<hr> auto-closes <p>
Categories
(Core :: DOM: HTML Parser, defect)
Core
DOM: HTML Parser
Tracking
()
RESOLVED
INVALID
People
(Reporter: hunteke, Assigned: mrbkap)
Details
(Keywords: testcase)
Attachments
(2 files)
User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1) Gecko/20061010 Firefox/2.0
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1) Gecko/20061010 Firefox/2.0
This bug looks extremely similar to bug #215612, but I'm putting it as new since that bug is more than 3 years old, and this is reproducible with the latest stable version of Firefox (as of 22 Dec 2006).
The web page code below highlights the exact problem and how to reproduce it.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv='content-type' content='text/html; charset=iso-8859-1' />
<meta name='modified' content='5:34pm Thu, 22 Jun 2006' />
<title>Demonstrate Firefox Javascript Parser Error</title>
<style>
</style>
<script type='text/javascript'>
var logOffsetX = null;
var logOffsetY = null;
var logger = null;
var body = null
var mouseDownWatcher = function ( event ) { log( '123DownForMe' ); }
var mouseUpWatcher = function ( event ) { log( '124UpForMore' ); }
var logMouseMove = function ( event ) {
logger.style.left = (event.pageX - logOffsetX) + 'px';
logger.style.top = (event.pageY - logOffsetY) + 'px';
}
var logMouseDown = function ( event ) {
logOffsetX = event.layerX;
logOffsetY = event.layerY;
logger.firstChild.addEventListener( 'mousemove', logMouseMove, false );
}
var logMouseUp = function ( event ) {
logger.firstChild.removeEventListener( 'mousemove', logMouseMove, false );
}
var cancelEvent = function ( event ) { event.stopPropagation(); }
var closeBox = function ( event ) {
var box = event.target.parentNode.parentNode;
box.style.display = 'none';
}
var tmp1;
var tmp2;
var tmp3;
var tmp4;
function log ( msg ) {
if ( null != logger ) {
if ( logger.style.display = 'none' ) {
logger.style.display = 'block';
}
return;
}
body.innerHTML += "<div class='logger' id='logger'><h3>Logger<span class='actionBox'>X</span></h3><div></div></div>";
logger = document.getElementById( 'logger' );
logger.logText = logger.lastChild;
var x = logger.firstChild; // the title bar, for movement
x.addEventListener( 'mousedown', logMouseDown, false );
x.addEventListener( 'mouseup', logMouseUp, false );
x = x.lastChild; // the X button
x.addEventListener( 'mousedown', cancelEvent, false );
x.addEventListener( 'click', closeBox, false );
// *******************************************
// <!-- ERROR OCCURS IN THIS BLOCK
// *******************************************
tmp1 = logger.innerHTML;
msg = '<p><hr /><span class="actionBox">X</span><span>' + msg + '</span></p>';
tmp2 = logger.innerHTML;
tmp3 = msg;
logger.logText.innerHTML += msg;
tmp4 = logger.logText.innerHTML;
// *******************************************
// -->
// *******************************************
logger.logText.innerHTML += '<hr /><p>Attempted to add this text to an innerHTML tag:<br />';
logger.logText.innerHTML += msg.replace( /<(.*?)>/g, '<tt><$1></tt>' );
logger.logText.innerHTML += "<br /><br />Here's what Firefox <em>actually</em> put:<br /><br />";
logger.logText.innerHTML += tmp4.replace( /<(.*?)>/g, '<tt><$1></tt>' )
logger.logText.innerHTML += '</p>';
logger.logText.innerHTML += "<p>You'll note that the <tt><p></tt> tag is immediately closed. The problem disappears when I fix the problem with my HTML, namely put the <tt><hr /></tt> tag <em>outside</em> of the <tt><p></tt> tag. (But it still renames <tt><hr /></tt> to <tt><hr></tt> ... ?)</p><p>So, granted that my HTML was wrong (it's corrected now), but it seems to me that Firefox is still not doing what I told it do. It doesn't throw an error either in the Javascript console, which it ought to at least do.</p><p>Thanks for your time,</p><p>Kevin Hunter</p>";
}
function init ( ) {
body = document.lastChild.lastChild;
document.addEventListener( 'mousedown', mouseDownWatcher, false );
}
</script>
</head>
<body onload='init()'>
<div id='main' class='main'>
<h1>An Error in the (Javascript?) Parser</h1>
<h3>Instructions: Click anywhere on the page.</h3>
<p>
I don't know if this is a bug with Javascript, or just the HTML parser, but I found it while fiddling with Javascript. (Apologies for the poor quality of the code, but I think it highlights well the problem.)
</p>
<p>
For reference, this bug looks extremely similar to Bug 215612 dated 08 Nov 2003. However, since this reproduces it more than 3 years later, I thought I'd make it new, and let you all make the call.
</p>
<p>
When you're ready, click anywhere on this page. A logging system should display. The browser should register that you have clicked and display a message. The short of it is that Firefox is reading my incorrect HTML, and making changes that even given my bad html, shouldn't happen. (And yes, I've now corrected my html. :P )
</p>
</div>
</body>
</html>
Reproducible: Always
Steps to Reproduce:
1. Copy & Paste above code to a new HTML file
2. View HTML file in Firefox 2.0
3. Follow instructions as presented.
|
||
Comment 1•19 years ago
|
||
Please attach your testcase using the "Create a New Attachment" link on
the bug page.
|
Reporter | |
Comment 2•19 years ago
|
||
I suppose the newlines created by directly cutting and pasting /would/ mess-up the javascript portions. Here ya go, with the error produced by lines 68 and 72.
|
|
||
Comment 3•19 years ago
|
||
Your testcase boils down to something like this:
<body><p>a<hr>b</p><script>alert(document.body.innerHTML)</script>
|
|
||
Updated•19 years ago
|
Assignee: nobody → mrbkap
Component: General → HTML: Parser
Keywords: testcase
OS: Linux → All
Product: Firefox → Core
QA Contact: general → parser
Hardware: PC → All
Summary: (javascript?) parser misplaces elements in quirks mode → <hr> auto-closes <p>
Version: unspecified → Trunk
|
|
||
Comment 4•19 years ago
|
||
Per HTML4, HR is %block and P can only contain %inline
http://www.w3.org/TR/REC-html40/sgml/dtd.html#block
-> INVALID
Status: UNCONFIRMED → RESOLVED
Closed: 19 years ago
Resolution: --- → INVALID
|
|
Reporter | |
Comment 5•19 years ago
|
||
(In reply to comment #4)
> Per HTML4, HR is %block and P can only contain %inline
> http://www.w3.org/TR/REC-html40/sgml/dtd.html#block
>
> -> INVALID
Thank you. I did not realize that Javascript held the "true" internal version of Firefox's parsing output, but it rather makes sense now that I think about it.
May I turn this into a suggestion then? In my case I was unaware that an <hr> tag auto-closed a <p> tag, but I found it because my CSS was getting messed up along with my data model. Might this be something that could be logged in the javascript console as perhaps a warning? (Might even be a way to teach some people to be careful with their X/HTML constructions. Like me, for example. :) )
|
|
||
Comment 6•19 years ago
|
||
There are several add-ons that do various forms of validation, go to
https://addons.mozilla.org/ and search for validator
or you can use web services like http://validator.w3.org/
|
||
Comment 7•19 years ago
|
||
(In reply to comment #6)
> There are several add-ons that do various forms of validation, go to
> https://addons.mozilla.org/ and search for validator
>
> or you can use web services like http://validator.w3.org/
>
I'd recommend Firebug which is available here: http://www.getfirebug.com/
It should be prefect for this stuff and the web development toolbar is useful too :)
You need to log in
before you can comment on or make changes to this bug.
Description
•