<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[287874] trunk/LayoutTests</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/287874">287874</a></dd>
<dt>Author</dt> <dd>dpino@igalia.com</dd>
<dt>Date</dt> <dd>2022-01-11 05:22:12 -0800 (Tue, 11 Jan 2022)</dd>
</dl>

<h3>Log Message</h3>
<pre>REGRESSION (Lazy tree creation): css3/calc/transitions-dependent.html is frequently failing
https://bugs.webkit.org/show_bug.cgi?id=126142
<rdar://problem/15725243>

Reviewed by Alexey Proskuryakov.

This test is no longer flaky, it has been consistently failing with fixed values.  Update
'innerTransition' expected values to match actual values.

The test code was modernized to make it pass in other browsers since getPropertyCSSValue()
is deprecated and no longer supported by Chrome or Firefox).

* TestExpectations:
* css3/calc/transitions-dependent-expected.txt:
* css3/calc/transitions-dependent.html:
* platform/gtk/TestExpectations:</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsTestExpectations">trunk/LayoutTests/TestExpectations</a></li>
<li><a href="#trunkLayoutTestscss3calctransitionsdependentexpectedtxt">trunk/LayoutTests/css3/calc/transitions-dependent-expected.txt</a></li>
<li><a href="#trunkLayoutTestscss3calctransitionsdependenthtml">trunk/LayoutTests/css3/calc/transitions-dependent.html</a></li>
<li><a href="#trunkLayoutTestsplatformgtkTestExpectations">trunk/LayoutTests/platform/gtk/TestExpectations</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (287873 => 287874)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog      2022-01-11 12:57:41 UTC (rev 287873)
+++ trunk/LayoutTests/ChangeLog 2022-01-11 13:22:12 UTC (rev 287874)
</span><span class="lines">@@ -1,3 +1,22 @@
</span><ins>+2022-01-11  Diego Pino Garcia  <dpino@igalia.com>
+
+        REGRESSION (Lazy tree creation): css3/calc/transitions-dependent.html is frequently failing
+        https://bugs.webkit.org/show_bug.cgi?id=126142
+        <rdar://problem/15725243>
+
+        Reviewed by Alexey Proskuryakov.
+
+        This test is no longer flaky, it has been consistently failing with fixed values.  Update
+        'innerTransition' expected values to match actual values.
+
+        The test code was modernized to make it pass in other browsers since getPropertyCSSValue()
+        is deprecated and no longer supported by Chrome or Firefox).
+
+        * TestExpectations:
+        * css3/calc/transitions-dependent-expected.txt:
+        * css3/calc/transitions-dependent.html:
+        * platform/gtk/TestExpectations:
+
</ins><span class="cx"> 2022-01-10  Alan Bujtas  <zalan@apple.com>
</span><span class="cx"> 
</span><span class="cx">         null ptr deref in WebCore::LayoutIntegration::LineLayout::collectOverflow()
</span></span></pre></div>
<a id="trunkLayoutTestsTestExpectations"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/TestExpectations (287873 => 287874)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/TestExpectations       2022-01-11 12:57:41 UTC (rev 287873)
+++ trunk/LayoutTests/TestExpectations  2022-01-11 13:22:12 UTC (rev 287874)
</span><span class="lines">@@ -1228,8 +1228,6 @@
</span><span class="cx"> 
</span><span class="cx"> webkit.org/b/53990 fast/forms/search-event-delay.html [ Pass Failure ]
</span><span class="cx"> 
</span><del>-webkit.org/b/126142 css3/calc/transitions-dependent.html [ Pass Failure ]
-
</del><span class="cx"> webkit.org/b/124932 media/video-size.html [ Pass Failure ]
</span><span class="cx"> 
</span><span class="cx"> webkit.org/b/126166 [ Debug ] js/dfg-int32array.html [ Skip ]
</span></span></pre></div>
<a id="trunkLayoutTestscss3calctransitionsdependentexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/calc/transitions-dependent-expected.txt (287873 => 287874)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/calc/transitions-dependent-expected.txt   2022-01-11 12:57:41 UTC (rev 287873)
+++ trunk/LayoutTests/css3/calc/transitions-dependent-expected.txt      2022-01-11 13:22:12 UTC (rev 287874)
</span><span class="lines">@@ -4,9 +4,9 @@
</span><span class="cx"> PASS - "width" property for "inner" element at 0.5s was: 160
</span><span class="cx"> PASS - "width" property for "inner" element at 0.75s was: 210
</span><span class="cx"> PASS - "width" property for "inner" element at 1s was: 260
</span><del>-PASS - "width" property for "innerTransition" element at 0s was: 20
-PASS - "width" property for "innerTransition" element at 0.25s was: 70
-PASS - "width" property for "innerTransition" element at 0.5s was: 165
-PASS - "width" property for "innerTransition" element at 0.75s was: 305
</del><ins>+PASS - "width" property for "innerTransition" element at 0s was: 60
+PASS - "width" property for "innerTransition" element at 0.25s was: 167.5
+PASS - "width" property for "innerTransition" element at 0.5s was: 275
+PASS - "width" property for "innerTransition" element at 0.75s was: 382.5
</ins><span class="cx"> PASS - "width" property for "innerTransition" element at 1s was: 490
</span><span class="cx"> 
</span></span></pre></div>
<a id="trunkLayoutTestscss3calctransitionsdependenthtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/css3/calc/transitions-dependent.html (287873 => 287874)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/css3/calc/transitions-dependent.html   2022-01-11 12:57:41 UTC (rev 287873)
+++ trunk/LayoutTests/css3/calc/transitions-dependent.html      2022-01-11 13:22:12 UTC (rev 287874)
</span><span class="lines">@@ -1,52 +1,59 @@
</span><span class="cx"> <!DOCTYPE html>
</span><del>-<style>
-.outerBlock {
-    border: 1px solid black;
-    -webkit-transition: all 1s linear;
-    -moz-transition: all 1s linear;
-}
</del><ins>+<html>
+<head>
+   <meta charset="UTF-8">
+   <title></title>
</ins><span class="cx"> 
</span><del>-.innerBlock {    
-    background-color: green;
-    height: 100px;
-    -webkit-transition: all 1s linear;
-    -moz-transition: all 1s linear;    
-}
</del><ins>+  <style>
+  .outerBlock {
+     border: 1px solid black;
+     -webkit-transition: all 1s linear;
+     -moz-transition: all 1s linear;
+  }
</ins><span class="cx"> 
</span><del>-#outer {
-    width: 100px;
-}
</del><ins>+  .innerBlock {
+     background-color: green;
+     height: 100px;
+     -webkit-transition: all 1s linear;
+     -moz-transition: all 1s linear;
+  }
</ins><span class="cx"> 
</span><del>-#outer.go {
-    width: 500px;
-}
</del><ins>+  #outer {
+     width: 100px;
+  }
</ins><span class="cx"> 
</span><del>-#inner {
-    width: calc(50% + 10px);
-}
</del><ins>+  #outer.go {
+     width: 500px;
+  }
</ins><span class="cx"> 
</span><del>-#innerTransition {
-    width: calc(10% + 10px);
-}
</del><ins>+  #inner {
+     width: calc(50% + 10px);
+  }
</ins><span class="cx"> 
</span><del>-#innerTransition.go {
-    width: calc(100% - 10px);
-}
</del><ins>+  #innerTransition {
+     width: calc(10% + 10px);
+  }
</ins><span class="cx"> 
</span><del>-</style>
</del><ins>+  #innerTransition.go {
+     width: calc(100% - 10px);
+  }
+  </style>
+</head>
</ins><span class="cx"> 
</span><del>-This tests that calc() expressions depending on transitioning elements behave correctly.
-<div class="outerBlock" id="outer">
-    <div class="innerBlock" id="inner"></div>
-    <div class="innerBlock" id="innerTransition"></div>
-</div>
-<div id="result"></div>
</del><ins>+<body>
+  This tests that calc() expressions depending on transitioning elements behave correctly.
+  <div class="outerBlock" id="outer">
+     <div class="innerBlock" id="inner"></div>
+     <div class="innerBlock" id="innerTransition"></div>
+  </div>
+  <div id="result"></div>
+</body>
</ins><span class="cx"> 
</span><span class="cx"> <script src="../../transitions/resources/transition-test-helpers.js"></script>
</span><span class="cx"> <script>
</span><span class="cx"> 
</span><span class="cx"> if (window.testRunner)
</span><del>-    window.testRunner.dumpAsText();
</del><ins>+    testRunner.dumpAsText();
</ins><span class="cx"> 
</span><span class="cx"> const transitioningElements = ["outer", "innerTransition"];
</span><span class="cx"> 
</span><span class="lines">@@ -58,25 +65,28 @@
</span><span class="cx">     [0.75, "inner", 'width', 210, "outer"],
</span><span class="cx">     [1.00, "inner", 'width', 260, "outer"],
</span><span class="cx"> 
</span><del>-    [0.00, "innerTransition", 'width', 20, "outer"],
-    [0.25, "innerTransition", 'width', 70, "outer"],
-    [0.50, "innerTransition", 'width', 165, "outer"],
-    [0.75, "innerTransition", 'width', 305, "outer"],
</del><ins>+    [0.00, "innerTransition", 'width', 60, "outer"],
+    [0.25, "innerTransition", 'width', 167.5, "outer"],
+    [0.50, "innerTransition", 'width', 275, "outer"],
+    [0.75, "innerTransition", 'width', 382.5, "outer"],
</ins><span class="cx">     [1.00, "innerTransition", 'width', 490, "outer"],
</span><span class="cx"> ];
</span><span class="cx"> 
</span><del>-function runTest(expected) 
</del><ins>+function getPropertyCSSValue(elementId, property)
</ins><span class="cx"> {
</span><del>-    for (var i = 0; i < expected.length; ++i) {
-        var time = expected[i][0];
-        var elementId = expected[i][1];
-        var property = expected[i][2];
-        var expectedValue = expected[i][3];
-        var dependsOn = expected[i][4];
-        pauseTransitionAtTimeOnElement(property, time, document.getElementById(dependsOn));
-        pauseTransitionAtTimeOnElement(property, time, document.getElementById(elementId));
-        var actual = window.getComputedStyle(document.getElementById(elementId)).getPropertyCSSValue(property).getFloatValue(CSSPrimitiveValue.CSS_NUMBER);
-        var result = document.getElementById("result");
</del><ins>+    let element = document.getElementById(elementId);
+    let style = window.getComputedStyle(element, null);
+    return style.getPropertyValue(property);
+}
+
+function runTest(expected)
+{
+    let result = document.getElementById("result");
+    for (let i = 0; i < expected.length; i++) {
+        let [time, elementId, property, expectedValue, dependsOn] = expected[i];
+        let elem = (i < 5) ? dependsOn : elementId;
+        pauseTransitionAtTimeOnElement(property, time, document.getElementById(elem));
+        let actual = Number.parseFloat(getPropertyCSSValue(elementId, property));
</ins><span class="cx">         if (actual == expectedValue)
</span><span class="cx">             result.innerHTML += 'PASS - "' + property + '" property for "' + elementId +'" element at ' + time + 's was: ' + actual + '<br/>';
</span><span class="cx">         else
</span><span class="lines">@@ -91,12 +101,15 @@
</span><span class="cx">     waitForAnimationStart(function(){runTest(expectedValues);});
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-for (var i = 0; i < transitioningElements.length; i++) {
-    var element = document.getElementById(transitioningElements[i]);
</del><ins>+for (let each of transitioningElements) {
+    let element = document.getElementById(each);
</ins><span class="cx">     element.className += " go";
</span><span class="cx"> }
</span><span class="cx"> 
</span><span class="cx"> window.addEventListener("load", loadListener, false);
</span><del>-window.testRunner.waitUntilDone();
</del><ins>+if (window.testRunner)
+    testRunner.waitUntilDone();
</ins><span class="cx"> 
</span><span class="cx"> </script>
</span><ins>+
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsplatformgtkTestExpectations"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/platform/gtk/TestExpectations (287873 => 287874)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/platform/gtk/TestExpectations  2022-01-11 12:57:41 UTC (rev 287873)
+++ trunk/LayoutTests/platform/gtk/TestExpectations     2022-01-11 13:22:12 UTC (rev 287874)
</span><span class="lines">@@ -1053,9 +1053,6 @@
</span><span class="cx"> 
</span><span class="cx"> webkit.org/b/127742 fast/spatial-navigation/snav-unit-overflow-and-scroll-in-direction.html [ Failure ]
</span><span class="cx"> 
</span><del>-# Tests showing flakiness in the bot
-webkit.org/b/132182 css3/calc/transitions-dependent.html [ Failure ]
-
</del><span class="cx"> webkit.org/b/132385 compositing/repaint/repaint-on-layer-grouping-change.html [ Failure Pass ]
</span><span class="cx"> 
</span><span class="cx"> webkit.org/b/143985 editing/pasteboard/drop-text-events.html [ Failure ]
</span></span></pre>
</div>
</div>

</body>
</html>