insert-block-child-after-many-inline-children.html

<!DOCTYPE html>
<html>
<head>
  <style>
    main {color: red}
    main.a {color: green}
  </style>
  <script src="../resources/runner.js"></script>
</head>
<body>
</body>

<script>

var isDone = false;
var startTime;

var red = 'rgb(255, 0, 0)';
var green = 'rgb(0, 128, 0)';

function testColor(color, expected, test_name) {
  PerfTestRunner.assert_true(
      color == expected,
      `${test_name}: Container color should be ${expected}, but ${color}`);
}

function runTest() {
  if (startTime) {
    PerfTestRunner.measureValueAsync(PerfTestRunner.now() - startTime);
    PerfTestRunner.addRunTestEndMarker();
  }
  if (!isDone) {
    PerfTestRunner.addRunTestStartMarker();
    startTime = PerfTestRunner.now();

    document.body.innerHTML = '<main id=container></main>';

    insertDivChildAfterManySpanChildren();

    // Re-run the same test.
    // Wait to allow the asynchronous accessibility code that's
    // covered by traceEventsToMeasure to have a chance to run.
    setTimeout(runTest, 2500);
  }
}

// Insert div child after many span children
function insertDivChildAfterManySpanChildren() {
  testColor(getComputedStyle(container).color, red, 'Initial color');

  for (let i = 0; i < 833; ++i)
    container.appendChild(document.createElement("span"));
  container.appendChild(document.createElement("div"));
  container.classList.add('a');

  testColor(getComputedStyle(container).color, green, 'Changed color');
}

PerfTestRunner.startMeasureValuesAsync({
    description: 'Test accessibility performance when insert block child after many inline children.',
    unit: 'ms',
    done: function () {
      isDone = true;
    },
    run: function() {
      runTest();
    },
    iterationCount: 6,
    tracingCategories: 'accessibility',
    traceEventsToMeasure: [
      'TotalAccessibilityCleanLayoutLifecycleStages',
      'ProcessDeferredUpdatesLifecycleStage',
      'FinalizingTreeLifecycleStage',
      'SerializeLifecycleStage',
      'RenderAccessibilityImpl::SendPendingAccessibilityEvents',
      'BrowserAccessibilityManager::OnAccessibilityEvents',
      'SerializeLocationChanges',
      "BrowserAccessibilityManager::OnLocationChanges"
    ]
});

</script>

</html>
chromium/third_party/blink/perf_tests/accessibility/insert-block-child-after-many-inline-children.html
