browser_computed_refresh-on-style-change_01.js (1559B)
1 /* Any copyright is dedicated to the Public Domain. 2 http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 6 // Tests that the computed view refreshes when the current node has its style 7 // changed. 8 9 const TEST_URI = "<div id='testdiv' style='font-size:10px;'>Test div!</div>"; 10 11 add_task(async function () { 12 await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI)); 13 const { inspector, view } = await openComputedView(); 14 await selectNode("#testdiv", inspector); 15 16 let fontSize = getComputedViewPropertyValue(view, "font-size"); 17 is(fontSize, "10px", "The computed view shows the right font-size"); 18 19 info("Changing the node's style and waiting for the update"); 20 let onUpdated = inspector.once("computed-view-refreshed"); 21 await setContentPageElementAttribute( 22 "#testdiv", 23 "style", 24 "font-size: 15px; color: red;" 25 ); 26 await onUpdated; 27 28 fontSize = getComputedViewPropertyValue(view, "font-size"); 29 is(fontSize, "15px", "The computed view shows the updated font-size"); 30 const color = getComputedViewPropertyValue(view, "color"); 31 is(color, "rgb(255, 0, 0)", "The computed view also shows the color now"); 32 33 info( 34 "Setting attribute that will add pres-hint style and waiting for the update" 35 ); 36 onUpdated = inspector.once("computed-view-refreshed"); 37 await setContentPageElementAttribute("#testdiv", "align", "right"); 38 await onUpdated; 39 const textAlign = getComputedViewPropertyValue(view, "text-align"); 40 is(textAlign, "-moz-right", "The computed view also shows text-align now"); 41 });