config.spec.js

describe('Desktop view', () => {
  context('Sidebar links', () => {
    beforeEach(() => {
      cy.visit('http://localhost:3000');
    });
  
    const quickStartIds = [
      'initialize',
      'writing-content',
      'preview-your-site',
      'manual-initialization',
      'loading-dialog',
    ];
    quickStartIds.forEach(id => {
      it('go to #quickstart?id=' + id, () => {
        cy.get(
          '.sidebar-nav > :nth-child(1) > :nth-child(1) > ul > :nth-child(1) > a'
        ).click();
  
        cy.get(`a.section-link[href='#/quickstart?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const configurationIds = [
      'el',
      'repo',
      'maxlevel',
      'loadnavbar',
      'loadsidebar',
      'hidesidebar',
      'submaxlevel',
      'auto2top',
      'homepage',
      'basepath',
      'relativepath',
      'coverpage',
      'logo',
      'name',
      'namelink',
      'markdown',
      'themecolor',
      'alias',
      'autoheader',
      'executescript',
      'noemoji',
      'mergenavbar',
      'formatupdated',
      'externallinktarget',
      'cornerexternallinktarget',
      'externallinkrel',
      'routermode',
      'nocompilelinks',
      'onlycover',
      'requestheaders',
      'ext',
      'fallbacklanguages',
      'notfoundpage',
    ];
    configurationIds.forEach(id => {
      it('go to #configuration?id=' + id, () => {
        cy.get('[href="#/configuration"]').click();
  
        cy.get(`a.section-link[href='#/configuration?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500); // its more far from the cover
            cy.matchImageSnapshot();
          });
      });
    });
  
    const morePagesIds = [
      'sidebar',
      'nested-sidebars',
      'set-page-titles-from-sidebar-selection',
      'table-of-contents',
      'ignoring-subheaders',
    ];
    morePagesIds.forEach(id => {
      it('go to #more-pages?id=' + id, () => {
        cy.get('[href="#/more-pages"]').click();
  
        cy.get(`a.section-link[href='#/more-pages?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const customNavbarIds = [
      'html',
      'markdown',
      'nesting',
      'combining-custom-navbars-with-the-emoji-plugin',
    ];
    customNavbarIds.forEach(id => {
      it('go to #custom-navbar?id=' + id, () => {
        cy.get('[href="#/custom-navbar"]').click();
  
        cy.get(`a.section-link[href='#/custom-navbar?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const coverIds = [
      'basic-usage',
      'custom-background',
      'coverpage-as-homepage',
      'multiple-covers',
    ];
    coverIds.forEach(id => {
      it('go to #cover?id=' + id, () => {
        cy.get('[href="#/cover"]').click();
  
        cy.get(`a.section-link[href='#/cover?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const themesIds = ['other-themes'];
    themesIds.forEach(id => {
      it('go to #themes?id=' + id, () => {
        cy.get('[href="#/themes"]').click();
  
        cy.get(`a.section-link[href='#/themes?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const pluginsIds = [
      'full-text-search',
      'google-analytics',
      'emoji',
      'external-script',
      'zoom-image',
      'edit-on-github',
      'demo-code-with-instant-preview-and-jsfiddle-integration',
      'copy-to-clipboard',
      'disqus',
      'gitalk',
      'pagination',
      'codefund',
      'tabs',
      'more-plugins',
    ];
    pluginsIds.forEach(id => {
      it('go to #plugins?id=' + id, () => {
        cy.get('[href="#/plugins"]').click();
  
        cy.get(`a.section-link[href='#/plugins?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const writeAPluginIds = ['full-configuration', 'example', 'tips'];
    writeAPluginIds.forEach(id => {
      it('go to #write-a-plugin?id=' + id, () => {
        cy.get('[href="#/write-a-plugin"]').click();
  
        cy.get(`a.section-link[href='#/write-a-plugin?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const markdownIds = ['supports-mermaid'];
    markdownIds.forEach(id => {
      it('go to #markdown?id=' + id, () => {
        cy.get('[href="#/markdown"]').click();
  
        cy.get(`a.section-link[href='#/markdown?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    it('go to #Language-highlight', () => {
      cy.get('a[href="#/language-highlight"]')
        .click()
        .then(() => {
          cy.wait(500);
          cy.matchImageSnapshot();
        });
    });
  
    // const deployIds = [
    //   'github-pages',
    //   'gitlab-pages',
    //   'firebase-hosting',
    //   'vps',
    //   'netlify',
    //   'zeit-now',
    //   'aws-amplify'
    // ]
    // deployIds.forEach(id => {
    //   it('go to #deploy?id=' + id, () => {
    //     cy.get('[href="#/deploy"]').click()
  
    //     cy.get(`a.section-link[href='#/deploy?id=${id}']`)
    //       .click()
    //       .then(() => {
    //         cy.wait(500)
    //         cy.matchImageSnapshot()
    //       })
    //   })
    // })
  
    const helpersIds = [
      'important-content',
      'general-tips',
      'ignore-to-compile-link',
      'set-target-attribute-for-link',
      'disable-link',
      'github-task-lists',
      'customise-id-for-headings',
      'markdown-in-html-tag',
    ];
    helpersIds.forEach(id => {
      it('go to #helpers?id=' + id, () => {
        cy.get('[href="#/helpers"]').click();
  
        cy.get(`a.section-link[href='#/helpers?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const vueIds = ['basic-usage', 'combine-vuep-to-write-playground'];
    vueIds.forEach(id => {
      it('go to #vue?id=' + id, () => {
        cy.get('[href="#/vue"]').click();
  
        cy.get(`a.section-link[href='#/vue?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const cdnIds = [
      'latest-version',
      'specific-version',
      'compressed-file',
      'other-cdn',
    ];
    cdnIds.forEach(id => {
      it('go to #cdn?id=' + id, () => {
        cy.get('[href="#/cdn"]').click();
  
        cy.get(`a.section-link[href='#/cdn?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const pwaIds = ['create-serviceworker', 'register', 'enjoy-it'];
    pwaIds.forEach(id => {
      it('go to #pwa?id=' + id, () => {
        cy.get('[href="#/pwa"]').click();
  
        cy.get(`a.section-link[href='#/pwa?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  
    const ssrIds = [
      'why-ssr',
      'quick-start',
      'custom-template',
      'configuration',
      'deploy-for-your-vps',
    ];
  
    ssrIds.forEach(id => {
      it('go to #ssr?id=' + id, () => {
        cy.get('[href="#/ssr"]').click();
  
        cy.get(`a.section-link[href='#/ssr?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
    const embedFilesIds = [
      'embedded-file-type',
      'embedded-code-fragments',
      'tag-attribute',
      'the-code-block-highlight',
    ];
    embedFilesIds.forEach(id => {
      it('go to #embed-files?id=' + id, () => {
        cy.get('[href="#/embed-files"]').click();
  
        cy.get(`a.section-link[href='#/embed-files?id=${id}']`)
          .click()
          .then(() => {
            cy.wait(500);
            cy.matchImageSnapshot();
          });
      });
    });
  });
});