Merge pull request #5326 from weseek/feat/create-page-vrt-test

feat: vrt test for  create page modal

packages/app/src/components/Navbar/GrowiNavbar.tsx

@@ -44,6 +44,7 @@ const NavbarRight: FC<NavbarRightProps> = memo((props: NavbarRightProps) => {
         <button
           className="px-md-3 nav-link btn-create-page border-0 bg-transparent"
           type="button"
+          data-testid="newPageBtn"
           onClick={() => openCreateModal(currentPagePath || '')}
         >
           <i className="icon-pencil mr-2"></i>

packages/app/src/components/PageCreateModal.jsx

@@ -211,7 +211,12 @@ const PageCreateModal = (props) => {
             </div>
 
             <div className="d-flex justify-content-end mt-1 mt-sm-0">
-              <button type="button" className="grw-btn-create-page btn btn-outline-primary rounded-pill text-nowrap ml-3" onClick={createInputPage}>
+              <button
+                type="button"
+                className="grw-btn-create-page btn btn-outline-primary rounded-pill text-nowrap ml-3"
+                onClick={createInputPage}
+                data-testid="createPageBtn"
+              >
                 <i className="icon-fw icon-doc"></i>{t('Create')}
               </button>
             </div>

packages/app/test/cypress/integration/2-basic-features/create-page.spec.ts

@@ -0,0 +1,33 @@
+context('Create page modal', () => {
+
+  const ssPrefix = 'create-page';
+
+  let connectSid: string | undefined;
+
+  before(() => {
+    // login
+    cy.fixture("user-admin.json").then(user => {
+      cy.login(user.username, user.password);
+    });
+    cy.getCookie('connect.sid').then(cookie => {
+      connectSid = cookie?.value;
+    });
+  });
+
+  beforeEach(() => {
+    if (connectSid != null) {
+      cy.setCookie('connect.sid', connectSid);
+      cy.visit('/');
+    }
+  });
+
+  it("Page create modal is shown successfully", () => {
+    cy.getByTestid('newPageBtn').click();
+     // eslint-disable-next-line cypress/no-unnecessary-waiting
+    cy.wait(1000);
+    cy.screenshot(`${ssPrefix}-open-page-create-modal`,{ capture: 'viewport' });
+    cy.getByTestid('createPageBtn').click();
+    cy.screenshot(`${ssPrefix}-create-clicked`, {capture: 'viewport'});
+  });
+
+});