From 64ded859bda9fa674382841a5d079980e2c7c0f4 Mon Sep 17 00:00:00 2001 From: Ilenia Date: Thu, 16 Jun 2022 15:14:25 +0200 Subject: [PATCH] fix(curriculum): tests for background-color in skyline project (#46489) * fix(curriculum): better validation of properties with variable value * more instances for which to use propValue --- .../5d822fd413a79914d39e98d7.md | 2 +- .../5d822fd413a79914d39e98d8.md | 6 +++--- .../5d822fd413a79914d39e98de.md | 2 +- .../5d822fd413a79914d39e98df.md | 2 +- .../5d822fd413a79914d39e98e0.md | 2 +- .../5d822fd413a79914d39e98e2.md | 4 ++-- .../5d822fd413a79914d39e98eb.md | 12 ++++++------ 7 files changed, 15 insertions(+), 15 deletions(-) diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md index bf07db2deab..7a32038adaf 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d7.md @@ -20,7 +20,7 @@ assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1a')?.backgroundColor You should use `var(--building-color1)` to set the `background-color` of the `.bb1a` element. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1a')?.backgroundColor.trim(), 'var(--building-color1)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1a')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` # --seed-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md index 5ef9b78353c..5925a6b622a 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98d8.md @@ -20,7 +20,7 @@ assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1b')?.backgroundColor You should use `var(--building-color1)` to set the `background-color` of the `.bb1b` element. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1b')?.backgroundColor.trim(), 'var(--building-color1)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1b')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` The `background-color` of the `bb1c` element should be set. @@ -32,7 +32,7 @@ assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1c')?.backgroundColor You should use `var(--building-color1)` to set the `background-color` of the `.bb1c` element. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1c')?.backgroundColor.trim(), 'var(--building-color1)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1c')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` The `background-color` of the `bb1d` element should be set. @@ -44,7 +44,7 @@ assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1d')?.backgroundColor You should use `var(--building-color1)` to set the `background-color` of the `.bb1d` element. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1d')?.backgroundColor.trim(), 'var(--building-color1)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1d')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` # --seed-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md index 9301ed8f9a3..0c9c0760532 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98de.md @@ -32,7 +32,7 @@ assert.exists(new __helpers.CSSHelp(document).getStyle('.bb2')?.backgroundColor) You should set the `background-color` using the `--building-color2` variable. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2')?.backgroundColor.trim(), 'var(--building-color2)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2')?.getPropVal('background-color', true), 'var(--building-color2)'); ``` # --seed-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98df.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98df.md index 7aadac56f07..6b1814f0cd0 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98df.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98df.md @@ -14,7 +14,7 @@ Hmm, I'm not sure why that didn't work. You can add a fallback value to a variab You should add a fallback value of `green` to the `background-color` property. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2')?.backgroundColor.trim(), 'var(--building-color2, green)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2')?.getPropVal('background-color', true), 'var(--building-color2,green)'); ``` # --seed-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md index a3b2cdcc43c..87d2ebe7732 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e0.md @@ -32,7 +32,7 @@ assert.exists(new __helpers.CSSHelp(document).getStyle('.bb3')?.backgroundColor) You should set the `background-color` using the `--building-color3` variable with a fallback of `pink`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb3')?.backgroundColor.trim(), 'var(--building-color3, pink)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb3')?.getPropVal('background-color', true), 'var(--building-color3,pink)'); ``` # --seed-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e2.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e2.md index 7fdf4d2af74..efcf3803775 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e2.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e2.md @@ -14,13 +14,13 @@ Now that you've worked the bugs out and the buildings are the right colors, you You should remove the fallback in the `background-color` from `.bb2`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2')?.backgroundColor, 'var(--building-color2)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2')?.getPropVal('background-color', true), 'var(--building-color2)'); ``` You should remove the fallback in the `background-color` from `.bb3`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.bb3')?.backgroundColor.trim(), 'var(--building-color3)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.bb3')?.getPropVal('background-color', true), 'var(--building-color3)'); ``` # --seed-- diff --git a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md index 97c69b1e7df..53f266ebeb0 100644 --- a/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md +++ b/curriculum/challenges/english/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98eb.md @@ -14,37 +14,37 @@ The skyline is coming together. Fill in the `background-color` property of the f You should give `.fb1` a `background-color` using `--building-color4`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.fb1')?.backgroundColor.trim(), 'var(--building-color4)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.fb1')?.getPropVal('background-color', true), 'var(--building-color4)'); ``` You should give `.fb2` a `background-color` using `--building-color3`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.fb2')?.backgroundColor, 'var(--building-color3)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.fb2')?.getPropVal('background-color', true), 'var(--building-color3)'); ``` You should give `.fb3` a `background-color` using `--building-color1`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.fb3')?.backgroundColor, 'var(--building-color1)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.fb3')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` You should give `.fb4` a `background-color` using `--building-color1`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.fb4')?.backgroundColor, 'var(--building-color1)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.fb4')?.getPropVal('background-color', true), 'var(--building-color1)'); ``` You should give `.fb5` a `background-color` using `--building-color2`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.fb5')?.backgroundColor, 'var(--building-color2)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.fb5')?.getPropVal('background-color', true), 'var(--building-color2)'); ``` You should give `.fb6` a `background-color` using `--building-color3`. ```js -assert.equal(new __helpers.CSSHelp(document).getStyle('.fb6')?.backgroundColor, 'var(--building-color3)'); +assert.equal(new __helpers.CSSHelp(document).getStyle('.fb6')?.getPropVal('background-color', true), 'var(--building-color3)'); ``` # --seed--