css-no-cache-revalidation.html | Explore in Territory

<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<body>
<script>
"use strict";
const CHILD_URL = "./resources/reference-css-no-cache.xhtml";
const EXPECTED_STYLE = "rgb(255, 0, 0) rgb(0, 128, 0)";

const queuedMessages = [];
const callbacksAwaitingMessages = [];
window.addEventListener("message", function(ev) {
    if (callbacksAwaitingMessages.length > 0) {
        const nextCallback = callbacksAwaitingMessages.shift();
        nextCallback(ev.data);
    } else {
        queuedMessages.push(ev.data);
    }
});
function dequeueMessage() {
    return new Promise((resolve, reject) => {
        if (queuedMessages.length === 0) {
            callbacksAwaitingMessages.push(resolve);
        } else {
            resolve(queuedMessages.shift());
        }
    });
}

function createFrame(name) {
    return new Promise((resolve, reject) => {
        const iframe = document.createElement("iframe");
        iframe.name = name;
        iframe.addEventListener("load", () => resolve(iframe), {once: true});
        iframe.src = CHILD_URL;
        window.document.documentElement.appendChild(iframe);
    });
}

function reloadFrame(frame) {
    return new Promise(resolve => {
        frame.addEventListener("load", () => resolve(frame), {once: true});
        frame.src = frame.src;
    });
}

promise_test(() => {
  var frameA, frameB;
  return Promise.resolve()
  .then(() => createFrame("A")).then(result => {
      frameA = result;
      frameA.contentWindow.postMessage("query applied style", "*");
  })
  .then(dequeueMessage).then(styleInfoA => {
      assert_equals(styleInfoA, "A " + EXPECTED_STYLE, "frame A should have the style applied");
  })
  .then(() => createFrame("B")).then(result => {
      frameB = result;
      frameB.contentWindow.postMessage("query applied style", "*");
  })
  .then(dequeueMessage).then(styleInfoB => {
      assert_equals(styleInfoB, "B " + EXPECTED_STYLE, "frame B should have the style applied");
  })
  .then(() => reloadFrame(frameA))
  .then(() => frameA.contentWindow.postMessage("query applied style", "*"))
  .then(dequeueMessage).then(styleInfoA => {
      assert_equals(styleInfoA, "A " + EXPECTED_STYLE, "frame A should have the style applied");
  })
  .then(() => frameB.contentWindow.postMessage("query applied style", "*"))
  .then(dequeueMessage).then(styleInfoB => {
      assert_equals(styleInfoB, "B " + EXPECTED_STYLE, "frame B should have the style applied");
  })
  .then(() => reloadFrame(frameB))
  .then(() => frameA.contentWindow.postMessage("query applied style", "*"))
  .then(dequeueMessage).then(styleInfoA => {
      assert_equals(styleInfoA, "A " + EXPECTED_STYLE, "frame A should have the style applied");
  })
  .then(() => frameB.contentWindow.postMessage("query applied style", "*"))
  .then(dequeueMessage).then(styleInfoB => {
      assert_equals(styleInfoB, "B " + EXPECTED_STYLE, "frame B should have the style applied");
  });
}, 'Revalidated CSS should not be unapplied on existing clients.');
</script>
chromium/third_party/blink/web_tests/http/tests/loading/css-no-cache-revalidation.html
