Test(DPxAI): Test for Quest00/Ex04

dom/class-it_test.js

@@ -0,0 +1,36 @@
+export const tests = []
+
+tests.push(async ({ page, eq }) => {
+  // check the class 'eye' has been declared properly in the CSS
+  eq.css('.eye', {
+    width: '60px',
+    height: '60px',
+    backgroundColor: 'red',
+    borderRadius: '50%',
+  })
+})
+
+tests.push(async ({ page, eq }) => {
+  // check the class 'arm' has been declared properly in the CSS
+  eq.css('.arm', { backgroundColor: 'aquamarine' })
+})
+
+tests.push(async ({ page, eq }) => {
+  // check the class 'leg' has been declared properly in the CSS
+  eq.css('.leg', { backgroundColor: 'dodgerblue' })
+})
+
+tests.push(async ({ page, eq }) => {
+  // check the class 'body-member' has been declared properly in the CSS
+  eq.css('.body-member', { width: '50px', margin: '30px' })
+})
+
+tests.push(async ({ page, eq }) => {
+  // check that the targetted elements have the correct class names
+  await eq.$('p#eye-left', { className: 'eye' })
+  await eq.$('p#eye-right', { className: 'eye' })
+  await eq.$('div#arm-left', { className: 'arm body-member' })
+  await eq.$('div#arm-right', { className: 'arm body-member' })
+  await eq.$('div#leg-left', { className: 'leg body-member' })
+  await eq.$('div#leg-right', { className: 'leg body-member' })
+})