chore(curriculum): use better asserts lab availability table (#57190)

Co-authored-by: Dario-DC <105294544+Dario-DC@users.noreply.github.com>
Co-authored-by: Ilenia <26656284+ilenia-magoni@users.noreply.github.com>

curriculum/challenges/english/25-front-end-development/lab-availability-table/66b36358ed4f261d64840c24.md

@@ -28,13 +28,13 @@ Fulfill the user stories below and get all the tests to pass to complete the lab
 You should have a `table` element.
 
 ```js
-assert(!!document.querySelectorAll('table').length);
+assert.isNotNull(document.querySelector('table'));
 ```
 
 You should have only one `table` element.
 
 ```js
-assert(document.querySelectorAll('table').length === 1);
+assert.lengthOf(document.querySelectorAll('table'), 1);
 ```
 
 Your table should have at least `5` rows.
@@ -47,7 +47,7 @@ Your table should have at least `3` columns.
 
 ```js
 const rows = [...document.querySelectorAll('tr')];
-assert(!!rows.length);
+assert.isNotEmpty(rows);
 rows.forEach((row) => {
     assert.isAtLeast(row.children.length, 3);
 })
@@ -62,8 +62,8 @@ assert.isAtLeast(document.querySelectorAll('tr:first-child>th').length, 3)
 The first row in your table should not contain `td` elements.
 
 ```js
-assert(document.querySelector('tr:first-child'));
-assert.lengthOf(document.querySelectorAll('tr:first-child>td'), 0)
+assert.isNotNull(document.querySelector('tr:first-child'));
+assert.isEmpty(document.querySelectorAll('tr:first-child>td'));
 ```
 
 You should have at least two rows with the class of `sharp`.
@@ -78,14 +78,14 @@ You should have at least two rows with the class of `half`.
 assert.isAtLeast(document.querySelectorAll('tr[class~="half"]').length, 2);
 ```
 
-`th` elements in the first column should have the `class` of `time` and the contain time values.
+`th` elements in the first column should have the `class` of `time` and contain time values.
 
 ```js
 const firstColumnData = [...document.querySelectorAll('tr th:first-child')];
-assert(!!firstColumnData.length);
+assert.isNotEmpty(firstColumnData);
 for (let cell of firstColumnData) {
     if (cell.innerText.match(/\d/)?.length) {
-        assert(cell.classList.contains('time'));
+        assert.isTrue(cell.classList.contains('time'));
     }
 }
 ```
@@ -96,7 +96,7 @@ You should have at least four `th` elements with the class of `time` that contai
 const timeClass = document.querySelectorAll('.time');
 assert.isAtLeast(timeClass.length, 4);
 for (let cell of timeClass) {
-    assert(cell.innerText.match(/\d/)?.length)
+    assert.match(cell.innerText, /\d/)
 }
 ```
 
@@ -104,7 +104,7 @@ All your `td` elements should have the `class` of `available-#`, where `#` is a
 
 ```js
 const cells = [...document.querySelectorAll('tr[class="sharp"]>td, tr[class="half"]>td')];
-assert(!!cells.length);
+assert.isNotEmpty(cells);
 for (let cell of cells) {
     const classString = [...cell.classList].join(' ');
     assert.lengthOf(classString.match(/(?<=\s|^)available-[0-5](?=\s|$)/gm), 1);
@@ -121,126 +121,142 @@ You should define a `--color0` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--color0'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--color0'))
 ```
 
 You should define a `--color1` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--color1'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--color1'))
 ```
 
 You should define a `--color2` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--color2'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--color2'))
 ```
 
 You should define a `--color3` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--color3'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--color3'));
 ```
 
 You should define a `--color4` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--color4'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--color4'));
 ```
 
 You should define a `--color5` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--color5'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--color5'));
 ```
 
 You should use `--color0` to set the background color of `.available-0` elements.
 
 ```js
 const a = new __helpers.CSSHelp(document).getStyle('.available-0');
-assert(!!a && a.backgroundColor === 'var(--color0)');
+assert.exists(a); 
+assert.strictEqual(a.backgroundColor, 'var(--color0)');
 ```
 
 You should use `--color1` to set the background color of `.available-1` elements.
 
 ```js
 const a = new __helpers.CSSHelp(document).getStyle('.available-1');
-assert(!!a && a.backgroundColor === 'var(--color1)');
+assert.exists(a); 
+assert.strictEqual(a.backgroundColor, 'var(--color1)');
 ```
 
 You should use `--color2` to set the background color of `.available-2` elements.
 
 ```js
 const a = new __helpers.CSSHelp(document).getStyle('.available-2');
-assert(!!a && a.backgroundColor === 'var(--color2)');
+assert.exists(a); 
+assert.strictEqual(a.backgroundColor, 'var(--color2)');
 ```
 
 You should use `--color3` to set the background color of `.available-3` elements.
 
 ```js
 const a = new __helpers.CSSHelp(document).getStyle('.available-3');
-assert(!!a && a.backgroundColor === 'var(--color3)');
+assert.exists(a); 
+assert.strictEqual(a.backgroundColor, 'var(--color3)');
 ```
 
 You should use `--color4` to set the background color of `.available-4` elements.
 
 ```js
 const a = new __helpers.CSSHelp(document).getStyle('.available-4');
-assert(!!a && a.backgroundColor === 'var(--color4)');
+assert.exists(a); 
+assert.strictEqual(a.backgroundColor, 'var(--color4)');
 ```
 
 You should use `--color5` to set the background color of `.available-5` elements.
 
 ```js
 const a = new __helpers.CSSHelp(document).getStyle('.available-5');
-assert(!!a && a.backgroundColor === 'var(--color5)');
+assert.exists(a); 
+assert.strictEqual(a.backgroundColor, 'var(--color5)');
 ```
 
 You should define a `--solid-border` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--solid-border'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--solid-border'));
 ```
 
 You should define a `--dashed-border` variable in your root selector.
 
 ```js
 const root = new __helpers.CSSHelp(document).getStyle(':root');
-assert(!!root && root.getPropVal('--dashed-border'));
+assert.exists(root); 
+assert.isNotEmpty(root.getPropVal('--dashed-border'));
 ```
 
 You should target `td` elements that are children of `.sharp` elements.
 
 ```js
 const tds = new __helpers.CSSHelp(document).getStyle('.sharp td') || new __helpers.CSSHelp(document).getStyle('.sharp>td');
-assert(tds);
+assert.exists(tds);
 ```
 
 You should use `--solid-border` to set the `bottom-border` of `td` elements that are children of `.sharp` elements.
 
 ```js
 const tds = new __helpers.CSSHelp(document).getStyle('.sharp td') || new __helpers.CSSHelp(document).getStyle('.sharp>td');
-assert(tds && tds.borderBottom === 'var(--solid-border)');
+assert.exists(tds);
+assert.strictEqual(tds.borderBottom, 'var(--solid-border)');
 ```
 
 You should target `td` elements that are children of `.half` elements.
 
 ```js
 const tds = new __helpers.CSSHelp(document).getStyle('.half td') || new __helpers.CSSHelp(document).getStyle('.half>td');
-assert(tds);
+assert.exists(tds);
 ```
 
 You should use `--dashed-border` to set the `bottom-border` of `td` elements of `.half` elements.
 
 ```js
 const tds = new __helpers.CSSHelp(document).getStyle('.half td') || new __helpers.CSSHelp(document).getStyle('.half>td');
-assert(tds && tds.borderBottom === 'var(--dashed-border)');
+assert.exists(tds);
+assert.strictEqual(tds.borderBottom, 'var(--dashed-border)');
 ```
 
 You should have a `div` element with the `id` of `legend`.
@@ -265,14 +281,16 @@ You should set the background image of `#legend-gradient` to a linear gradient.
 
 ```js
 const legendGradient = new __helpers.CSSHelp(document).getStyle('#legend-gradient');
-assert(!!legendGradient && legendGradient.backgroundImage.includes('linear-gradient('))
+assert.exists(legendGradient); 
+assert.include(legendGradient.backgroundImage, "linear-gradient(")
 ```
 
 You should use two color-stops (expressed in percentage) to make the transition from one color to the following color a hard line for your `#legend-gradient`. Remember to use your `--color#` variables.
 
 ```js
 const legendGradient = new __helpers.CSSHelp(document).getStyle('#legend-gradient');
-assert(!!legendGradient && legendGradient.backgroundImage.match(/var\(\s*--color[0-5]\s*\)\s+\d+%\s+\d+%/g).length === 6)
+assert.exists(legendGradient); 
+assert.lengthOf(legendGradient.backgroundImage.match(/var\(\s*--color[0-5]\s*\)\s+\d+%\s+\d+%/g), 6)
 ```
 
 # --seed--