browser_boxmodel_rotate-labels-on-sides.js (1969B)
1 /* Any copyright is dedicated to the Public Domain. 2 http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 6 // Test that longer values are rotated on the side 7 8 const res1 = [ 9 { selector: ".boxmodel-margin.boxmodel-top > span", value: 30 }, 10 { selector: ".boxmodel-margin.boxmodel-left > span", value: "auto" }, 11 { selector: ".boxmodel-margin.boxmodel-bottom > span", value: 30 }, 12 { selector: ".boxmodel-margin.boxmodel-right > span", value: "auto" }, 13 { selector: ".boxmodel-padding.boxmodel-top > span", value: 20 }, 14 { selector: ".boxmodel-padding.boxmodel-left > span", value: 2000000 }, 15 { selector: ".boxmodel-padding.boxmodel-bottom > span", value: 20 }, 16 { selector: ".boxmodel-padding.boxmodel-right > span", value: 20 }, 17 { selector: ".boxmodel-border.boxmodel-top > span", value: 10 }, 18 { selector: ".boxmodel-border.boxmodel-left > span", value: 10 }, 19 { selector: ".boxmodel-border.boxmodel-bottom > span", value: 10 }, 20 { selector: ".boxmodel-border.boxmodel-right > span", value: 10 }, 21 ]; 22 23 const TEST_URI = encodeURIComponent( 24 [ 25 "<style>", 26 "div { border:10px solid black; padding: 20px 20px 20px 2000000px; " + 27 "margin: 30px auto; }", 28 "</style>", 29 "<div></div>", 30 ].join("") 31 ); 32 const LONG_TEXT_ROTATE_LIMIT = 3; 33 34 add_task(async function () { 35 await addTab("data:text/html," + TEST_URI); 36 const { inspector, boxmodel } = await openLayoutView(); 37 await selectNode("div", inspector); 38 39 for (let i = 0; i < res1.length; i++) { 40 const elt = boxmodel.document.querySelector(res1[i].selector); 41 const isLong = elt.textContent.length > LONG_TEXT_ROTATE_LIMIT; 42 const classList = elt.parentNode.classList; 43 const canBeRotated = 44 classList.contains("boxmodel-left") || 45 classList.contains("boxmodel-right"); 46 const isRotated = classList.contains("boxmodel-rotate"); 47 48 is( 49 canBeRotated && isLong, 50 isRotated, 51 res1[i].selector + " correctly rotated." 52 ); 53 } 54 });