Bug 21114 - Hang on specific combo of XHTML and CSS
Summary: Hang on specific combo of XHTML and CSS
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: 528+ (Nightly build)
Hardware: Macintosh Intel OS X 10.5
: P1 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2008-09-25 12:00 PDT by Rasmus Andersson
Modified: 2008-09-26 05:42 PDT (History)
0 users

See Also:


Attachments
Crash log (741.42 KB, text/plain)
2008-09-25 12:01 PDT, Rasmus Andersson
no flags Details
File used to reproduce crash (12.75 KB, text/html)
2008-09-25 12:14 PDT, Rasmus Andersson
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Rasmus Andersson 2008-09-25 12:00:05 PDT
A specific combination of a certain XHTML elements and CSS causes WebKit to hang for a very long time (or even crash). We have drilled down a HTML file reproducing this bug in WebKit/Safari 3.1.2 (5525.20.1)

What I did:
* Started Safari
* Opened crash.html

What I expected to happen:
* Safari rendering the document.

What actually did happen:
* Safari used up 100% of one cpu core and became unresponsive.

FILES:
crash.html – Opening this file in Safari reproduces the bug
----
<!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" xml:lang="en" lang="en">
	<head>
		<title>Spotify - Share</title>
		<style type="text/css">
      div.section.beta-tokens div.token-info-text {
      	padding-left:1em;
      	float:left;
      }
		</style>
	</head>
	<body>
		<div id="logo" onclick="document.location.href='/'">

			<div class="menu">
				<a href="/">Home</a><a href="/download/">Download</a><a href="/account/">My Account</a><a href="/share" class="active">Share</a><a href="/help/">Help</a><a href="/legal/">Legal</a>			</div>
		</div>
					<div id="loggedinfo">
				<small>

					Logged in as <!--a href="/account"-->john.doe<!--/a-->
					(<a href="/logout">log out</a>)
				</small>
			</div>
					<div id="supercontainer">
<script type="text/javascript" charset="utf-8">
	function sanitize_val(s) {
		return s.replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
	}
	function on_resend_mail(elem, addr, token) {
		/*snip*/
	}
</script>
<div class="section beta-tokens">

	<h1>Your Invitation Tokens</h1>
	<p>
					<hr />
			<h2>People you have invited</h2>
			<p>
				<ul>
				<li class="odd-row"><b>lisbeth</b> was born from <tt>E3wVt4Xn6uqi4wA7</tt> <small>Initially sent to <b>john.doe@foo.bar</b></small></li><li class="even-row"><b>robert</b> was born from <tt>fwn2tc9UpLthgs8p</tt> <small>Initially sent to <b>john.doe@foo.bar</b></small></li></ul>

				<br /><br />
			</p>
						<hr />
			<form class="invite" method="post" action="/share/">
				<h2>Active invitations</h2>
				<p>
					<ul>
					<li class="odd-row"><div class="token sent">36kYVxXH8RJjEELA</div><div class="token-info-text">Was sent to <b>john.doe@foo.bar</b><br /><a href="javascript:;" onclick="on_resend_mail(this, 'john.doe@foo.bar', '36kYVxXH8RJjEELA')"><small>Send again (or to another address)...</small></a></div><br clear="all" /></li><li class="even-row"><div class="token new">aVUFRydaTxAnRUFM</div><div class="token-info-text"><input type="hidden" name="token[]" value="aVUFRydaTxAnRUFM" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">2PVsNUGsMaSCGaRd</div><div class="token-info-text"><input type="hidden" name="token[]" value="2PVsNUGsMaSCGaRd" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">iJFGqZ7JnVjxkaBE</div><div class="token-info-text"><input type="hidden" name="token[]" value="iJFGqZ7JnVjxkaBE" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">eTMxCN8Yp7akKhLu</div><div class="token-info-text"><input type="hidden" name="token[]" value="eTMxCN8Yp7akKhLu" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">cUcbZuinLqZABRsN</div><div class="token-info-text"><input type="hidden" name="token[]" value="cUcbZuinLqZABRsN" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">GSs7P9YF8nFyes3i</div><div class="token-info-text"><input type="hidden" name="token[]" value="GSs7P9YF8nFyes3i" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">DaP7BxJBX2cdb2Df</div><div class="token-info-text"><input type="hidden" name="token[]" value="DaP7BxJBX2cdb2Df" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">6MFfYnqVN4Afbuax</div><div class="token-info-text"><input type="hidden" name="token[]" value="6MFfYnqVN4Afbuax" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">WqppMxpy45Qy847n</div><div class="token-info-text"><input type="hidden" name="token[]" value="WqppMxpy45Qy847n" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">RUCLYSY2cDdRpZyq</div><div class="token-info-text"><input type="hidden" name="token[]" value="RUCLYSY2cDdRpZyq" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">TuDQbzEzEZGHYn2s</div><div class="token-info-text"><input type="hidden" name="token[]" value="TuDQbzEzEZGHYn2s" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">eRAkwpBYCtjB2yF6</div><div class="token-info-text"><input type="hidden" name="token[]" value="eRAkwpBYCtjB2yF6" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">WHfuzD9mn547RW44</div><div class="token-info-text"><input type="hidden" name="token[]" value="WHfuzD9mn547RW44" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">niZxgabtkH9LWCEc</div><div class="token-info-text"><input type="hidden" name="token[]" value="niZxgabtkH9LWCEc" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">BGtexjVe8acUYR6L</div><div class="token-info-text"><input type="hidden" name="token[]" value="BGtexjVe8acUYR6L" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">e98wJV8dyL9WyLeY</div><div class="token-info-text"><input type="hidden" name="token[]" value="e98wJV8dyL9WyLeY" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">jQnEqbcy8huHNn44</div><div class="token-info-text"><input type="hidden" name="token[]" value="jQnEqbcy8huHNn44" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">FZ6NiN8jCaznVmCh</div><div class="token-info-text"><input type="hidden" name="token[]" value="FZ6NiN8jCaznVmCh" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">9JAduGbNbKdk5B6y</div><div class="token-info-text"><input type="hidden" name="token[]" value="9JAduGbNbKdk5B6y" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">Yw8dEwY5bDR7R4LL</div><div class="token-info-text"><input type="hidden" name="token[]" value="Yw8dEwY5bDR7R4LL" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">7b4dCfqjCBpedsuC</div><div class="token-info-text"><input type="hidden" name="token[]" value="7b4dCfqjCBpedsuC" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">KCZTnjkCwjhDZf72</div><div class="token-info-text"><input type="hidden" name="token[]" value="KCZTnjkCwjhDZf72" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">CN5pcxyYskebJK7Z</div><div class="token-info-text"><input type="hidden" name="token[]" value="CN5pcxyYskebJK7Z" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="odd-row"><div class="token new">Qb7PUsBYN8XDG5Eg</div><div class="token-info-text"><input type="hidden" name="token[]" value="Qb7PUsBYN8XDG5Eg" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li><li class="even-row"><div class="token new">BAggUDgbtHmhnT2A</div><div class="token-info-text"><input type="hidden" name="token[]" value="BAggUDgbtHmhnT2A" />Send to&nbsp;&nbsp;<input class="email" type="text" style="color:#888888" onfocus="if(this.value=='friends e-mail address'){this.value='';this.style.color='#000000';}" name="email[]" value="friends e-mail address" /></div><div style="clear:both" /></li></ul>

					<br />
					<div id="send-tip-ctrl" style="display:block">
						<div class="button">
							<input type="submit" name="send" value="Send Invitations" />
						</div>
						<div class="text">
							Tip: You can add your friends name to the invitation by writing the 
							e-mail address like this:&nbsp;&nbsp;<tt>John Doe john.doe@foo.bar</tt>
						</div>

						<br clear="all" />
					</div>
				</p>
			</form>
						<br /><br />
			<hr />
				<form method="post" action="/share/">
			<h2>Unused invitations</h2>

			<p>
									<span style="color:#999">You have no more invitations I'm afraid.</span>
							</p>
		</form>
	</p>
</div>
		</div>
				<div class="bottom-copyright">
			Copyright © 2007 Spotify Technology SARL | <a href="/legal/beta-agreement">Beta Agreement</a>

					</div>
			</body>
</html>
----

Crash dump of Safari:
----
This file is 8.2 MB large and when I tried pasting it here (using Safari) the browser crashed. (such irony!) So I'm providing the crash dump on this URL: https://apple.spotify.net/tmp/Safari_crash.txt
Comment 1 Rasmus Andersson 2008-09-25 12:01:23 PDT
Created attachment 23811 [details]
Crash log
Comment 2 Rasmus Andersson 2008-09-25 12:14:55 PDT
Created attachment 23815 [details]
File used to reproduce crash
Comment 3 Alexey Proskuryakov 2008-09-26 00:52:15 PDT
Confirmed with r36890 - I'm not sure if it ever resumes, but it didn't for me in a minute or so.

The attached and linked files are spin dumps, not crash logs, so it is not clear if this can actually cause a crash (an unexpected quit).

> This file is 8.2 MB large and when I tried pasting it here (using Safari) the
> browser crashed. (such irony!)

It's good that this amount of text is not on the report though, it would make it really hard to follow. What kind of crash was this - did the browser unexpectedly quit, or just hang for a long period of time?
Comment 4 Rasmus Andersson 2008-09-26 05:42:08 PDT
After posting this report I realized one could attach files. That was not obvious (or even mentioned) on the report form.

And yes, sorry. Spin dump is correct. Generated after I killed Safari.