WebKit Bugzilla
New
Browse
Search+
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
Test-case
bug_120065.html (text/html), 2.84 KB, created by
Mihai Balan
on 2013-08-20 06:43:48 PDT
(
hide
)
Description:
Test-case
Filename:
MIME Type:
Creator:
Mihai Balan
Created:
2013-08-20 06:43:48 PDT
Size:
2.84 KB
patch
obsolete
><!DOCTYPE html> ><html> > <head> > <title>CSS Regions: named flow content has contentEditable attribute set and is fragmented</title> > <link rel="author" title="Mihai Balan" href="mailto:mibalan@adobe.com"> > <link rel="help" href="http://www.w3.org/TR/css3-regions/#the-flow-into-property"> > <link rel="help" href="http://www.w3.org/TR/css3-regions/#the-flow-from-property"> > <link rel="help" href="http://www.w3.org/TR/html5/editing.html#contenteditable"> > <meta name="flags" content="dom interact"> > <meta name="assert" content="Test checks that setting the contentEditable attribute on > elements that get flowed in a region does not affect their rendering and the ability to edit > them even when they get fragmented in multiple regions."> > <link rel="match" href="reference/contentEditable-005-ref.html"> > <link rel="stylesheet" href="support/common.css"> > <style> > .flowed { > -webkit-flow-into: flow; > } > .content { > font-family: Times, serif; > font-size: 20px; > line-height: 1em; > } > .region { > -webkit-flow-from: flow; > width: 300px; > height: 75px; > border: 2px solid black; > margin: 0.5em 0 0.5em 0; > } > .region > p { > background-color: red; > width: 100%; > height: 50%; > } > </style> > </head> > <body> > <ol> > <li>Below you should see a rectangle with a black border with some text inside it. No > red should be visible at any time during this test.</li> > <li>Click between the first pair of green and blue colored markers and type > “<strong>foobar bazquux</strong>” > <ul> > <li>The text you typed is displayed at the cursor position between the > two markers and the lines of text wrap inside the black border</li> > </ul> > </li> > <li>Click between the second pair of green and blue colored markers and type > “<strong>foobar bazquux</strong>” > <ul> > <li>The text you typed is displayed at the cursor position between the > two markers and the lines of text wrap inside the black border</li> > </ul> > </li> > </ol> > <div class="content flowed" contentEditable="true"> > <!-- On a single line since new lines in contentEditable elements are messy :( --> > This is some text that should be editable. Even the text between <em><span class="inline-marker green"></span> <span id="marked-one">these two markers</span> <span class="inline-marker blue"></span></em>.<br> > > Likewise, this text <em><span class="inline-marker green"></span> <span id="marked-two">between these colored markers</span> <span class="inline-marker blue"></span></em> should be editable. > </div> > > <div class="region"> > <p> </p> > </div> > <div class="region"> > <p> </p> > </div> > > <script type="text/javascript" src="support/helpers.js"></script> > <script type="text/javascript"> > insertText("#marked-one", "foobar bazquux"); > insertText("#marked-two", "foobar bazquux"); > </script> > </body> ></html>
<!DOCTYPE html> <html> <head> <title>CSS Regions: named flow content has contentEditable attribute set and is fragmented</title> <link rel="author" title="Mihai Balan" href="mailto:mibalan@adobe.com"> <link rel="help" href="http://www.w3.org/TR/css3-regions/#the-flow-into-property"> <link rel="help" href="http://www.w3.org/TR/css3-regions/#the-flow-from-property"> <link rel="help" href="http://www.w3.org/TR/html5/editing.html#contenteditable"> <meta name="flags" content="dom interact"> <meta name="assert" content="Test checks that setting the contentEditable attribute on elements that get flowed in a region does not affect their rendering and the ability to edit them even when they get fragmented in multiple regions."> <link rel="match" href="reference/contentEditable-005-ref.html"> <link rel="stylesheet" href="support/common.css"> <style> .flowed { -webkit-flow-into: flow; } .content { font-family: Times, serif; font-size: 20px; line-height: 1em; } .region { -webkit-flow-from: flow; width: 300px; height: 75px; border: 2px solid black; margin: 0.5em 0 0.5em 0; } .region > p { background-color: red; width: 100%; height: 50%; } </style> </head> <body> <ol> <li>Below you should see a rectangle with a black border with some text inside it. No red should be visible at any time during this test.</li> <li>Click between the first pair of green and blue colored markers and type “<strong>foobar bazquux</strong>” <ul> <li>The text you typed is displayed at the cursor position between the two markers and the lines of text wrap inside the black border</li> </ul> </li> <li>Click between the second pair of green and blue colored markers and type “<strong>foobar bazquux</strong>” <ul> <li>The text you typed is displayed at the cursor position between the two markers and the lines of text wrap inside the black border</li> </ul> </li> </ol> <div class="content flowed" contentEditable="true"> <!-- On a single line since new lines in contentEditable elements are messy :( --> This is some text that should be editable. Even the text between <em><span class="inline-marker green"></span> <span id="marked-one">these two markers</span> <span class="inline-marker blue"></span></em>.<br> Likewise, this text <em><span class="inline-marker green"></span> <span id="marked-two">between these colored markers</span> <span class="inline-marker blue"></span></em> should be editable. </div> <div class="region"> <p> </p> </div> <div class="region"> <p> </p> </div> <script type="text/javascript" src="support/helpers.js"></script> <script type="text/javascript"> insertText("#marked-one", "foobar bazquux"); insertText("#marked-two", "foobar bazquux"); </script> </body> </html>
View Attachment As Raw
Actions:
View
Attachments on
bug 120065
: 209190