caretPositionFromPoint-with-transformation.html (1664B)
1 <!doctype html> 2 <meta charset="utf-8"> 3 <title>getCaretPositionFromPoint should return the correct offset even in iframes with transformation</title> 4 <link rel="help" href="https://drafts.csswg.org/cssom-view-1/#dom-document-caretpositionfrompoint"> 5 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1546612"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <style> 9 #actual { 10 transform: translateX(100px); 11 } 12 </style> 13 <iframe id="expected"></iframe> 14 <br> 15 <iframe id="actual"></iframe> 16 <script> 17 const expectedFrame = document.getElementById("expected"); 18 const actualFrame = document.getElementById("actual"); 19 20 const getCaretPositionOffset = frame => { 21 const source = `<!doctype html><meta charset="utf-8"><h1>title</h1><p>paragraph</p>` 22 23 const elementCenter = elem => { 24 const rect = elem.getBoundingClientRect(); 25 return [rect.x + rect.width / 2, rect.y + rect.height / 2]; 26 }; 27 28 return new Promise((resolve, reject) => { 29 frame.srcdoc = source; 30 frame.onload = () => { 31 try { 32 const frameDoc = frame.contentDocument; 33 const {offset} = frameDoc.caretPositionFromPoint( 34 ...elementCenter(frameDoc.querySelector("h1")) 35 ); 36 resolve(offset); 37 } catch (error) { 38 reject(error); 39 } 40 }; 41 }); 42 }; 43 44 promise_test(async () => { 45 assert_equals(...await Promise.all([ 46 getCaretPositionOffset(expectedFrame), 47 getCaretPositionOffset(actualFrame) 48 ]), "caret offset"); 49 }, "iframe's with equal content should report the same caret offset"); 50 </script>