display-computed.html

Enable keyboard shortcuts

This test has a WPT meta file that expects 6 subtest issues.
This WPT test may be referenced by the following Test IDs:
- /css/css-display/parsing/tentative/display-computed.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>CSS Display: getComputedStyle().display</title>

<link rel="author" title="Ethan Jimenez" href="mailto:ethavar@microsoft.com">

<link rel="help" href="https://tabatkins.github.io/specs/css-masonry/#masonry-containers">

<meta name="assert" content="position and float can change display computed value.">

<meta name="assert" content="display computed value is otherwise as specified.">

<script src="/resources/testharness.js"></script>

<script src="/resources/testharnessreport.js"></script>

<script src="/css/support/computed-testcommon.js"></script>

</head>

<body>

<div id="target"></div>

<script>

'use strict';

// https://tabatkins.github.io/specs/css-masonry/#masonry-containers

test_computed_value("display", "masonry");

test_computed_value("display", "inline-masonry");

// https://www.w3.org/TR/CSS2/visuren.html#dis-pos-flo

function test_display_affected(property, value) {

  const target = document.getElementById('target');

  test(() => {

    target.style[property] = value;

    target.style.display = 'inline-masonry';

    assert_equals(getComputedStyle(target).display, 'masonry', 'inline-masonry -> masonry');

    target.style[property] = '';

    target.style.display = '';

  }, property + ' ' + value + ' affects computed display');

test_display_affected("position", "absolute");

test_display_affected("position", "fixed");

test_display_affected("float", "left");

test_display_affected("float", "right");

</script>

</body>

</html>