feat(home): add codecept tests

src/components/Card/Card.tsx

@@ -90,7 +90,7 @@ function Card({
             {featured && !disabled && enableTitle && <div className={classNames(styles.title, { [styles.loading]: loading })}>{title}</div>}
             <div className={styles.tags}>
               {isLocked && (
-                <div className={classNames(styles.tag, styles.lock)}>
+                <div className={classNames(styles.tag, styles.lock)} aria-label={t('card_lock')}>
                   <Lock />
                 </div>
               )}

src/i18n/locales/en_US/common.json

@@ -1,5 +1,6 @@
 {
   "back": "Back",
+  "card_lock": "Item locked",
   "close_modal": "Close",
   "confirmation_dialog": {
     "close": "Cancel",

src/i18n/locales/en_US/user.json

@@ -3,7 +3,6 @@
     "about_you": "About you",
     "cancel": "Cancel",
     "confirm_password": "Confirm password",
-    "delete_account": "Delete account",
     "edit_account": "Edit account",
     "edit_information": "Edit information",
     "edit_password": "Edit password",

src/i18n/locales/nl_NL/common.json

@@ -1,5 +1,6 @@
 {
   "back": "",
+  "card_lock": "",
   "close_modal": "",
   "confirmation_dialog": {
     "close": "",

src/i18n/locales/nl_NL/user.json

@@ -3,7 +3,6 @@
     "about_you": "",
     "cancel": "",
     "confirm_password": "",
-    "delete_account": "",
     "edit_account": "",
     "edit_information": "",
     "edit_password": "",

test/home_mobile_test.js

@@ -1,6 +1,5 @@
 Feature('home').tag('@mobile');
 
-
 Scenario('Mobile home screen loads', ({ I }) => {
   I.amOnPage('http://localhost:8080');
   I.see('Blender');
@@ -16,4 +15,53 @@ Scenario('Menu button opens the sidebar', ({ I }) => {
   I.click('Films');
   I.amOnPage('http://localhost:8080/p/sR5VypYk');
   I.see('All Films');
+  I.see('The Daily Dweebs');
 });
+
+Scenario('I can slide within the featured shelf', ({ I }) => {
+  I.amOnPage('http://localhost:8080?c=blender');
+  I.see('Blender Channel');
+  I.see('LIVE');
+  I.seeElement({ css: 'div[aria-label="Item locked"]' })
+  I.dontSee('Spring');
+  I.dontSee('8 min');
+
+  // todo: Simulate swipe events
+
+  // I.click({ css: 'div[aria-label="Slide right"]' });
+  // I.wait(0.4);
+  // I.see('Spring');
+  // I.see('8 min');
+  // I.dontSee('Blender Channel');
+  // I.dontSee('LIVE');
+  // I.click({ css: 'div[aria-label="Slide left"]' }, 'div[class="_shelfContainer_1i652_13 _featured_1i652_16"]');
+  // I.wait(0.4);
+  // I.see('Blender Channel');
+  // I.dontSee('Spring');
+});
+
+Scenario('I can slide within non-featured shelves', ({ I }) => {
+  I.amOnPage('http://localhost:8080?c=blender');
+  I.scrollTo({ css: 'div[data-mediaid="sR5VypYk"]' });
+  I.see('All Films');
+  I.see('Agent 327');
+  I.see('4 min');
+  I.dontSee('Cosmos Laundromat');
+  I.dontSee('13 min');
+  // I.click({ css: 'div[aria-label="Slide right"]' }, 'div[data-mediaid="sR5VypYk"]');
+  // I.wait(0.4);
+  // I.see('Cosmos Laundromat');
+  // I.see('13 min');
+  // I.dontSee('Agent 327');
+  // I.click({ css: 'div[aria-label="Slide left"]' }, 'div[data-mediaid="sR5VypYk"]');
+  // I.wait(0.4);
+  // I.see('Agent 327');
+  // I.dontSee('Cosmos Laundromat');
+});
+
+Scenario('I can see the footer', ({ I }) => {
+  I.scrollPageToBottom('Blender Foundation');
+  I.see('cloud.blender.org');
+  I.click('cloud.blender.org');
+});
+

test/home_test.js

@@ -1,17 +1,66 @@
 Feature('home').tag('@desktop');
 
 Scenario('Desktop home screen loads', ({ I }) => {
-  I.amOnPage('http://localhost:8080');
+  I.amOnPage('http://localhost:8080?c=blender');
   I.see('Agent 327');
   I.see('Home');
   I.see('Films');
   I.see('Courses');
 });
 
 Scenario('Header button navigates to playlist screen', ({ I }) => {
-  I.amOnPage('http://localhost:8080');
+  I.amOnPage('http://localhost:8080?c=blender');
   I.see('Films');
   I.click('Films');
   I.amOnPage('http://localhost:8080/p/sR5VypYk');
   I.see('All Films');
+  I.see('The Daily Dweebs');
 });
+
+Scenario('I can slide within the featured shelf', ({ I }) => {
+  I.amOnPage('http://localhost:8080?c=blender');
+  I.see('Blender Channel');
+  I.see('LIVE');
+  I.seeElement({ css: 'div[aria-label="Item locked"]' })
+  I.dontSee('Spring');
+  I.dontSee('8 min');
+  I.click({ css: 'div[aria-label="Slide right"]' });
+  I.wait(0.4);
+  I.see('Spring');
+  I.see('8 min');
+  I.dontSee('Blender Channel');
+  I.dontSee('LIVE');
+  I.click({ css: 'div[aria-label="Slide left"]' }, 'div[class="_shelfContainer_1i652_13 _featured_1i652_16"]');
+  I.wait(0.4);
+  I.see('Blender Channel');
+  I.dontSee('Spring');
+});
+
+//todo: 
+// within('div[data-mediaid="sR5VypYk"]', () => {});
+
+Scenario('I can slide within non-featured shelves', ({ I }) => {
+  I.amOnPage('http://localhost:8080?c=blender');
+  I.scrollTo({ css: 'div[data-mediaid="sR5VypYk"]' });
+  I.see('All Films');
+  I.see('Agent 327');
+  I.see('4 min');
+  I.dontSee('Cosmos Laundromat');
+  I.dontSee('13 min');
+  I.click({ css: 'div[aria-label="Slide right"]' }, 'div[data-mediaid="sR5VypYk"]');
+  I.wait(0.4);
+  I.see('Cosmos Laundromat');
+  I.see('13 min');
+  I.dontSee('Agent 327');
+  I.click({ css: 'div[aria-label="Slide left"]' }, 'div[data-mediaid="sR5VypYk"]');
+  I.wait(0.4);
+  I.see('Agent 327');
+  I.dontSee('Cosmos Laundromat');
+});
+
+Scenario('I can see the footer', ({ I }) => {
+  I.scrollPageToBottom('Blender Foundation');
+  I.see('cloud.blender.org');
+  I.click('cloud.blender.org');
+});
+