summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-typed-om/the-stylepropertymap/inline/iterable.tentative.html
blob: ae4490f4aaa2b98b8c70fff97499d5632178e730 (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
48
49
50
<!doctype html>
<meta charset="utf-8">
<title>StylePropertyMap iterable tests</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#the-stylepropertymap">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<body>
<script>
'use strict';

test(t => {
  const styleMap = createInlineStyleMap(t, '');
  assert_array_equals([...styleMap.entries()], []);
}, 'Iterating over an empty StylePropertyMap gives a zero-length array');

test(t => {
  const styleMap = createInlineStyleMap(t, '--A: A; width: 10px; --C: C; transition-duration: 1s, 2s; color: red; --B: B;');
  assert_array_equals([...styleMap.keys()],
    ['--A', 'width', '--C', 'transition-duration', 'color', '--B']);
}, 'StylePropertyMap iterates properties in inline style order');

test(t => {
  const styleMap = createInlineStyleMap(t, 'width: 10px; height: 5px');
  const keys = [...styleMap.keys()], values = [...styleMap.values()];

  assert_array_equals(keys, ['width', 'height']);
  assert_style_value_array_equals(values[0], [CSS.px(10)]);
  assert_style_value_array_equals(values[1], [CSS.px(5)]);
}, 'StylePropertyMap iterator returns CSS properties with the correct CSSStyleValue');

test(t => {
  const styleMap = createInlineStyleMap(t, 'transition-duration: 1s, 2s');
  const keys = [...styleMap.keys()], values = [...styleMap.values()];

  assert_array_equals(keys, ['transition-duration']);
  assert_style_value_array_equals(values[0], [CSS.s(1), CSS.s(2)]);
}, 'StylePropertyMap iterator returns list-valued properties with the correct CSSStyleValue');

test(t => {
  const styleMap = createInlineStyleMap(t, '--A: A; --B: B; --C: C');
  const keys = [...styleMap.keys()], values = [...styleMap.values()];

  assert_array_equals(keys, ['--A', '--B', '--C']);
  assert_style_value_array_equals(values[0], [new CSSUnparsedValue(['A'])]);
  assert_style_value_array_equals(values[1], [new CSSUnparsedValue(['B'])]);
  assert_style_value_array_equals(values[2], [new CSSUnparsedValue(['C'])]);
}, 'StylePropertyMap iterator returns custom properties with the correct CSSStyleValue');

</script>