[Color 4] Add tests for color.channel() (#1978)

sass · Apr 24, 2024 · 5769c74 · 5769c74
1 parent 71c13cf
commit 5769c74
Show file tree

Hide file tree

Showing 19 changed files with 1,162 additions and 0 deletions.
diff --git a/spec/core_functions/color/channel/a98-rgb.hrx b/spec/core_functions/color/channel/a98-rgb.hrx
@@ -0,0 +1,63 @@
+<===> local/red/input.scss
+@use 'sass:color';
+a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "red")}
+
+<===> local/red/output.css
+a {
+  b: 0.2;
+}
+
+<===>
+================================================================================
+<===> local/green/input.scss
+@use 'sass:color';
+a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "green")}
+
+<===> local/green/output.css
+a {
+  b: 0.5;
+}
+
+<===>
+================================================================================
+<===> local/blue/input.scss
+@use 'sass:color';
+a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "blue")}
+
+<===> local/blue/output.css
+a {
+  b: 0.8;
+}
+
+<===>
+================================================================================
+<===> foreign/red/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "red", $space: a98-rgb)}
+
+<===> foreign/red/output.css
+a {
+  b: 0.9363244101;
+}
+
+<===>
+================================================================================
+<===> foreign/green/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "green", $space: a98-rgb)}
+
+<===> foreign/green/output.css
+a {
+  b: 0.7473920857;
+}
+
+<===>
+================================================================================
+<===> foreign/blue/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "blue", $space: a98-rgb)}
+
+<===> foreign/blue/output.css
+a {
+  b: 0.7893042668;
+}
diff --git a/spec/core_functions/color/channel/display-p3.hrx b/spec/core_functions/color/channel/display-p3.hrx
@@ -0,0 +1,63 @@
+<===> local/red/input.scss
+@use 'sass:color';
+a {b: color.channel(color(display-p3 0.2 0.5 0.8), "red")}
+
+<===> local/red/output.css
+a {
+  b: 0.2;
+}
+
+<===>
+================================================================================
+<===> local/green/input.scss
+@use 'sass:color';
+a {b: color.channel(color(display-p3 0.2 0.5 0.8), "green")}
+
+<===> local/green/output.css
+a {
+  b: 0.5;
+}
+
+<===>
+================================================================================
+<===> local/blue/input.scss
+@use 'sass:color';
+a {b: color.channel(color(display-p3 0.2 0.5 0.8), "blue")}
+
+<===> local/blue/output.css
+a {
+  b: 0.8;
+}
+
+<===>
+================================================================================
+<===> foreign/red/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "red", $space: display-p3)}
+
+<===> foreign/red/output.css
+a {
+  b: 0.9621487118;
+}
+
+<===>
+================================================================================
+<===> foreign/green/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "green", $space: display-p3)}
+
+<===> foreign/green/output.css
+a {
+  b: 0.7628803605;
+}
+
+<===>
+================================================================================
+<===> foreign/blue/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "blue", $space: display-p3)}
+
+<===> foreign/blue/output.css
+a {
+  b: 0.7971503319;
+}
diff --git a/spec/core_functions/color/channel/error.hrx b/spec/core_functions/color/channel/error.hrx
@@ -0,0 +1,159 @@
+<===> too_few_args/input.scss
+@use "sass:color";
+a {b: color.channel(pink)}
+
+<===> too_few_args/error
+Error: Missing argument $channel.
+  ,--> input.scss
+2 | a {b: color.channel(pink)}
+  |       ^^^^^^^^^^^^^^^^^^^ invocation
+  '
+  ,--> sass:color
+1 | @function channel($color, $channel, $space: null) {
+  |           ======================================= declaration
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> too_many_args/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "red", rgb, "red")}
+
+<===> too_many_args/error
+Error: Only 3 arguments allowed, but 4 were passed.
+  ,--> input.scss
+2 | a {b: color.channel(pink, "red", rgb, "red")}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation
+  '
+  ,--> sass:color
+1 | @function channel($color, $channel, $space: null) {
+  |           ======================================= declaration
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> type/color/input.scss
+@use "sass:color";
+a {b: color.channel("pink", "red")}
+
+<===> type/color/error
+Error: $color: "pink" is not a color.
+  ,
+2 | a {b: color.channel("pink", "red")}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> type/channel/input.scss
+@use "sass:color";
+a {b: color.channel(pink, red)}
+
+<===> type/channel/error
+Error: $channel: red is not a string.
+  ,
+2 | a {b: color.channel(pink, red)}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> type/space/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "red", red)}
+
+<===> type/space/error
+Error: $space: red is not a string.
+  ,
+2 | a {b: color.channel(pink, "red", red)}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> channel/unquoted/input.scss
+@use "sass:color";
+a {b: color.channel(hsl(50deg 50% 50%), hue)}
+
+<===> channel/unquoted/error
+Error: $channel: Expected hue to be a quoted string.
+  ,
+2 | a {b: color.channel(hsl(50deg 50% 50%), hue)}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> channel/wrong_space/input.scss
+@use "sass:color";
+a {b: color.channel(red, "hue")}
+
+<===> channel/wrong_space/error
+Error: $channel: Color red has no channel named hue.
+  ,
+2 | a {b: color.channel(red, "hue")}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> channel/wrong_case/input.scss
+@use "sass:color";
+a {b: color.channel(red, "RED")}
+
+<===> channel/wrong_case/error
+Error: $channel: Color red has no channel named RED.
+  ,
+2 | a {b: color.channel(red, "RED")}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> channel/unknown/input.scss
+@use "sass:color";
+a {b: color.channel(red, "foo")}
+
+<===> channel/unknown/error
+Error: $channel: Color red has no channel named foo.
+  ,
+2 | a {b: color.channel(red, "foo")}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> space/quoted/input.scss
+@use "sass:color";
+a {b: color.channel(red, "hue", $space: "hsl")}
+
+<===> space/quoted/error
+Error: $space: Expected "hsl" to be an unquoted string.
+  ,
+2 | a {b: color.channel(red, "hue", $space: "hsl")}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
+
+<===>
+================================================================================
+<===> space/unknown/input.scss
+@use "sass:color";
+a {b: color.channel(red, "hue", $space: "foo")}
+
+<===> space/unknown/error
+Error: $space: Expected "foo" to be an unquoted string.
+  ,
+2 | a {b: color.channel(red, "hue", $space: "foo")}
+  |       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+  '
+  input.scss 2:7  root stylesheet
diff --git a/spec/core_functions/color/channel/hsl.hrx b/spec/core_functions/color/channel/hsl.hrx
@@ -0,0 +1,74 @@
+<===> local/hue/input.scss
+@use 'sass:color';
+a {b: color.channel(hsl(10 40% 60%), "hue")}
+
+<===> local/hue/output.css
+a {
+  b: 10deg;
+}
+
+<===>
+================================================================================
+<===> local/saturation/input.scss
+@use 'sass:color';
+a {b: color.channel(hsl(10deg 40% 60%), "saturation")}
+
+<===> local/saturation/output.css
+a {
+  b: 40%;
+}
+
+<===>
+================================================================================
+<===> local/lightness/input.scss
+@use 'sass:color';
+a {b: color.channel(hsl(10deg 40% 60%), "lightness")}
+
+<===> local/lightness/output.css
+a {
+  b: 60%;
+}
+
+<===>
+================================================================================
+<===> local/normalized/hue/input.scss
+@use 'sass:color';
+a {b: color.channel(hsl(540 40% 60%), "hue")}
+
+<===> local/normalized/hue/output.css
+a {
+  b: 180deg;
+}
+
+<===>
+================================================================================
+<===> foreign/hue/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "hue", $space: hsl)}
+
+<===> foreign/hue/output.css
+a {
+  b: 349.5238095238deg;
+}
+
+<===>
+================================================================================
+<===> foreign/saturation/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "saturation", $space: hsl)}
+
+<===> foreign/saturation/output.css
+a {
+  b: 100%;
+}
+
+<===>
+================================================================================
+<===> foreign/lightness/input.scss
+@use "sass:color";
+a {b: color.channel(pink, "lightness", $space: hsl)}
+
+<===> foreign/lightness/output.css
+a {
+  b: 87.6470588235%;
+}