Diff
Modified: trunk/LayoutTests/ChangeLog (133105 => 133106)
--- trunk/LayoutTests/ChangeLog 2012-11-01 01:12:47 UTC (rev 133105)
+++ trunk/LayoutTests/ChangeLog 2012-11-01 01:21:26 UTC (rev 133106)
@@ -1,3 +1,18 @@
+2012-10-31 Bear Travis <[email protected]>
+
+ [CSS Exclusions] Test that dynamically setting shape-inside causes relayout in child elements
+ https://bugs.webkit.org/show_bug.cgi?id=97721
+
+ Reviewed by Dirk Schulze.
+
+ Adding a test that dynamically sets shape-inside on a block containing multiple block children.
+
+ * fast/exclusions/resources/simple-rectangle.js:
+ (createRectangleTest): Modifying test to work with elements with existing content.
+ (createRectangleTestResult): Modifying test expectation to work with elements with existing content.
+ * fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic-expected.html: Added.
+ * fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic.html: Added.
+
2012-10-31 Roger Fong <[email protected]>
Unreviewed. Skip another failing drag and drop test.
Modified: trunk/LayoutTests/fast/exclusions/resources/simple-rectangle.js (133105 => 133106)
--- trunk/LayoutTests/fast/exclusions/resources/simple-rectangle.js 2012-11-01 01:12:47 UTC (rev 133105)
+++ trunk/LayoutTests/fast/exclusions/resources/simple-rectangle.js 2012-11-01 01:21:26 UTC (rev 133106)
@@ -25,7 +25,8 @@
rules.push('position: absolute', 'display: block', 'content: \' \'');
rules.push('border: 1px solid blue');
stylesheet.insertRule('#' + elementId + '::before{' + rules.join(';') + '}');
- elem.innerHTML = content;
+ if (content)
+ elem.innerHTML = content;
}
function createRectangleTestResult(elementId, stylesheetId, bounds, shapeBounds, units, content) {
@@ -51,5 +52,6 @@
rules.push('position: absolute', 'display: block', 'content: \' \'');
rules.push('border: 1px solid blue');
stylesheet.insertRule('#' + elementId + '::before{' + rules.join(';') + '}');
- elem.innerHTML = content;
+ if (content)
+ elem.innerHTML = content;
}
Added: trunk/LayoutTests/fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic-expected.html (0 => 133106)
--- trunk/LayoutTests/fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic-expected.html (rev 0)
+++ trunk/LayoutTests/fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic-expected.html 2012-11-01 01:21:26 UTC (rev 133106)
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style id='stylesheet'>
+div {
+ font: 50px/1 Ahem, sans-serif;
+ color: green;
+}
+p {
+ margin: 0;
+}
+</style>
+<script src=''></script>
+<script>
+ window._onload_ = function() {
+ createRectangleTestResult('shape-inside1', 'stylesheet', { width: 200, height: 200 }, { x: 50, y: 50, width: 100, height: 100 }, 'px', '<p>XX</p><p>XX</p>');
+ createRectangleTestResult('shape-inside2', 'stylesheet', { width: 200, height: 200 }, { x: 50, y: 50, width: 100, height: 100 }, 'px', '<p>XX</p><p>XX</p>');
+ };
+</script>
+</head>
+<body>
+<p>This test requires the Ahem font. It tests that dynamically set shape-insides should affect their block's children. You should see two green squares inside blue outlines.</p>
+<div id='shape-inside1'></div>
+<div id='shape-inside2'></div>
+</body>
+</html>
Added: trunk/LayoutTests/fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic.html (0 => 133106)
--- trunk/LayoutTests/fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic.html (rev 0)
+++ trunk/LayoutTests/fast/exclusions/shape-inside/shape-inside-multiple-blocks-dynamic.html 2012-11-01 01:21:26 UTC (rev 133106)
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style id='stylesheet'>
+div {
+ font: 50px/1 Ahem, sans-serif;
+ color: green;
+}
+p {
+ margin: 0;
+}
+</style>
+<script src=''></script>
+<script>
+ window._onload_ = function() {
+ createRectangleTest('shape-inside1', 'stylesheet', { width: 200, height: 200 }, { x: 50, y: 50, width: 100, height: 100 }, 'px', null);
+ createRectangleTest('shape-inside2', 'stylesheet', { width: 200, height: 200 }, { x: 50, y: 50, width: 100, height: 100 }, 'px', null);
+ };
+</script>
+</head>
+<body>
+<p>This test requires the Ahem font. It tests that dynamically set shape-insides should affect their block's children. You should see two green squares inside blue outlines.</p>
+<div id='shape-inside1'><p>XX</p><p>XX</p></div>
+<div id='shape-inside2'><div><p>XX</p><p>XX</p></div>
+</body>
+</html>
