Просмотр исходного кода

Add sticky changes test for guest

https://youtrack.weseek.co.jp/issue/GW-7949
- Create cypress spec file for guest mode
- Unify Fab display changes on scroll down and top
- Add initial scroll down for change page sticky test
Mudana-Grune 3 лет назад
Родитель
Сommit
b9d4426900

+ 17 - 5
packages/app/test/cypress/integration/23-sticky/23-sticky--fab.spec.ts

@@ -14,7 +14,9 @@ context('Access to sticky Fab', () => {
     cy.collapseSidebar(true);
   });
 
-  it('Fab is displayed on scroll down', () => {
+  it('Fab display changes on scroll down and up', () => {
+
+    // Visible
     cy.waitUntil(() => {
       // do
       // Scroll the window 250px down is enough to trigger sticky effect
@@ -24,11 +26,9 @@ context('Access to sticky Fab', () => {
         return cy.getByTestid('grw-fab-page-create-button').then($elem => $elem.hasClass('visible'));
       });
     });
+    cy.screenshot(`${ssPrefix}is-visible-on-scroll-down`);
 
-    cy.screenshot(`${ssPrefix}is-sticky-on-scroll-down`);
-  });
-
-  it('Fab is invisible on scroll top', () => {
+    // Invisible
     cy.waitUntil(() => {
       //do
       // Scroll the window back to top
@@ -43,6 +43,18 @@ context('Access to sticky Fab', () => {
   });
 
   it('Fab is not displayed when move to other pages', () => {
+
+    // Initial scroll down
+    cy.waitUntil(() => {
+      // do
+      // Scroll the window 250px down is enough to trigger sticky effect
+       cy.scrollTo(0, 250);
+      // wait until
+      return cy.getByTestid('grw-fab-container').within(() => {
+        return cy.getByTestid('grw-fab-page-create-button').then($elem => $elem.hasClass('visible'));
+      });
+    });
+
     // Move to /Sandbox page
     cy.visit('/Sandbox');
 

+ 59 - 0
packages/app/test/cypress/integration/23-sticky/23-sticky--for-guest.spec.ts

@@ -0,0 +1,59 @@
+context('Access sticky sub navigation switcher and Fab for guest', () => {
+  const ssPrefix = 'access-sticky-by-guest-';
+  it('Sub navigation sticky changes when scrolling down and up', () => {
+    cy.visit('/Sandbox');
+    cy.waitUntilSkeletonDisappear();
+    cy.collapseSidebar(true, true);
+
+    // Sticky
+    cy.waitUntil(() => {
+      // do
+      // Scroll page down 250px
+      cy.scrollTo(0, 250);
+      // wait until
+      return cy.getByTestid('grw-subnav-switcher').then($elem => !$elem.hasClass('grw-subnav-switcher-hidden'));
+    });
+    cy.screenshot(`${ssPrefix}subnav-switcher-is-sticky-on-scroll-down`);
+
+    // Not sticky
+    cy.waitUntil(() => {
+      // do
+      // Scroll page to top
+      cy.scrollTo(0, 0);
+      // wait until
+      return cy.getByTestid('grw-subnav-switcher').then($elem => $elem.hasClass('grw-subnav-switcher-hidden'));
+    });
+    cy.screenshot(`${ssPrefix}subnav-switcher-is-not-sticky-on-scroll-top`);
+  });
+
+  it('Fab display changes when scrolling down and up', () => {
+    cy.visit('/Sandbox');
+    cy.waitUntilSkeletonDisappear();
+    cy.collapseSidebar(true, true);
+
+    // Visible
+    cy.waitUntil(() => {
+      // do
+      // Scroll the window 250px down is enough to trigger sticky effect
+       cy.scrollTo(0, 250);
+      // wait until
+      return cy.getByTestid('grw-fab-container').within(() => {
+        return cy.getByTestid('grw-fab-return-to-top').then($elem => $elem.hasClass('visible'));
+      });
+    });
+    cy.screenshot(`${ssPrefix}fab-is-visible-on-scroll-down`);
+
+    // Invisible
+    cy.waitUntil(() => {
+      // do
+      // Scroll page to top
+       cy.scrollTo(0, 0);
+      // wait until
+      return cy.getByTestid('grw-fab-container').within(() => {
+        return cy.getByTestid('grw-fab-return-to-top').then($elem => !$elem.hasClass('visible'));
+      });
+    });
+    cy.screenshot(`${ssPrefix}fab-is-invisible-on-scroll-down`);
+
+  });
+});