testing/web-platform/tests/css/css-typed-om/stylevalue-subclasses/cssScale.tentative.html

   1 <!doctype html>
   2 <meta charset="utf-8">
   3 <title>CSSScale tests</title>
   4 <link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#cssscale">
   5 <script src="/resources/testharness.js"></script>
   6 <script src="/resources/testharnessreport.js"></script>
   7 <script src="../resources/testhelper.js"></script>
   8 <script>
   9 'use strict';
  10
  11 const gInvalidCoordTestCases = [
  12   { coord: CSS.deg(1), desc: 'an angle CSSUnitValue'},
  13   { coord: new CSSMathSum(CSS.px(1)), desc: 'a CSSMathValue that doesn\'t match <number>'},
  14   { coord: new CSSMathProduct(CSS.px(1), new CSSMathInvert(CSS.px(1))), desc: 'an invalid division by px/px'},
  15 ];
  16
  17 for (const {coord, desc} of gInvalidCoordTestCases) {
  18   test(() => {
  19     assert_throws_js(TypeError, () => new CSSScale(coord, 0));
  20     assert_throws_js(TypeError, () => new CSSScale(0, coord));
  21     assert_throws_js(TypeError, () => new CSSScale(coord, 0, 0));
  22     assert_throws_js(TypeError, () => new CSSScale(0, coord, 0));
  23     assert_throws_js(TypeError, () => new CSSScale(0, 0, coord));
  24   }, 'Constructing a CSSScale with ' + desc + ' for the coordinates throws a TypeError');
  25 }
  26
  27 for (const attr of ['x', 'y', 'z']) {
  28   for (const {value, desc} of gInvalidCoordTestCases) {
  29     test(() => {
  30       let result = new CSSScale(0, 0, 0);
  31       assert_throws_js(TypeError, () => result[attr] = value);
  32       assert_style_value_equals(result[attr], CSS.number(0));
  33     }, 'Updating CSSScale.' + attr + ' to ' + desc + ' throws a TypeError');
  34   }
  35 }
  36
  37 test(() => {
  38   const result = new CSSScale(-3.14, CSS.number(3.14));
  39   assert_style_value_equals(result.x, CSS.number(-3.14));
  40   assert_style_value_equals(result.y, CSS.number(3.14));
  41   assert_style_value_equals(result.z, CSS.number(1));
  42   assert_true(result.is2D);
  43 }, 'CSSScale can be constructed from two number coordinates');
  44
  45 test(() => {
  46   const result = new CSSScale(-3.14, CSS.number(3.14), -3.14);
  47   assert_style_value_equals(result.x, CSS.number(-3.14));
  48   assert_style_value_equals(result.y, CSS.number(3.14));
  49   assert_style_value_equals(result.z, CSS.number(-3.14));
  50   assert_false(result.is2D);
  51 }, 'CSSScale can be constructed from three number coordinates');
  52
  53 test(() => {
  54   const result = new CSSScale(new CSSMathSum(-3.14), new CSSMathMax(3.14), new CSSMathNegate(-3.14));
  55   assert_style_value_equals(result.x, new CSSMathSum(-3.14));
  56   assert_style_value_equals(result.y, new CSSMathMax(3.14));
  57   assert_style_value_equals(result.z, new CSSMathNegate(-3.14));
  58   assert_false(result.is2D);
  59 }, 'CSSScale can be constructed from CSSMathValue coordinates');
  60
  61 for (const attr of ['x', 'y', 'z']) {
  62   test(() => {
  63     let result = new CSSScale(0, 0, 0);
  64     result[attr] = 3.14;
  65     assert_style_value_equals(result[attr], CSS.number(3.14));
  66   }, 'CSSScale.' + attr + ' can be updated to a number');
  67
  68   test(() => {
  69     let result = new CSSScale(0, 0, 0);
  70     result[attr] = CSS.number(3.14);
  71     assert_style_value_equals(result[attr], CSS.number(3.14));
  72   }, 'CSSScale.' + attr + ' can be updated to a numberish');
  73
  74   test(() => {
  75     let result = new CSSScale(0, 0, 0);
  76     result[attr] = new CSSMathSum(3.14);
  77     assert_style_value_equals(result[attr], new CSSMathSum(3.14));
  78   }, 'CSSScale.' + attr + ' can be updated to a CSSMathValue');
  79 }
  80
  81 test(() => {
  82   let rotation = new CSSScale(0, 0, 0);
  83   rotation.is2D = true;
  84   assert_true(rotation.is2D);
  85   rotation.is2D = false;
  86   assert_false(rotation.is2D);
  87 }, 'Modifying CSSScale.is2D can be updated to true or false');
  88
  89 </script>