summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/paint-timing/with-first-paint/first-contentful-canvas-webgl2.html
blob: f7c5f50ecba0bd5a5d45fb41a02d0457e49e6713 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>

<head>
  <title>Performance Paint Timing Test: FCP due to canvas</title>
</head>

<body>
  <script src="/resources/testharness.js"></script>
  <script src="/resources/testharnessreport.js"></script>
  <canvas id="canvas" width="200" height="200"></canvas>

  <script>
    setup({ "hide_test_state": true });
    async_test(function (t) {
      assert_implements(window.PerformancePaintTiming, "Paint Timing isn't supported.");
      const canvas = document.getElementById("canvas");
      const context = canvas.getContext("webgl2");
      if (!context) {
        assert_implements_optional(context, "WebGL 2 Canvas isn't supported.")
      }
      context.clearColor(0.3, 0.3, 0.3, 1);
      context.clear(context.COLOR_BUFFER_BIT);
      function testPaintEntries() {
        const bufferedEntries = performance.getEntriesByType('paint');
        if (bufferedEntries.length < 2) {
          t.step_timeout(function () {
            testPaintEntries();
          }, 20);
          return;
        }
        t.step(function () {
          assert_equals(bufferedEntries.length, 2, "There should be two paint timing instances.");
          assert_equals(bufferedEntries[0].entryType, "paint");
          assert_equals(bufferedEntries[0].name, "first-paint");
          assert_equals(bufferedEntries[1].entryType, "paint");
          assert_equals(bufferedEntries[1].name, "first-contentful-paint");
          t.done();
        });
      };
      t.step(function () {
        testPaintEntries();
      });
    }, "First contentful paint fires due to webgl2 canvas render.");
  </script>
</body>

</html>