How to use getRecordKeys method in Cypress

Best JavaScript code snippet using cypress

settings_spec.js

Source:settings_spec.js

1const { _ } = Cypress2const { each, flow, get, isString, join, map, merge, set, sortBy, toPairs } = require('lodash/fp')3describe('Settings', () => {4  beforeEach(function () {5    cy.fixture('user').as('user')6    cy.fixture('config').as('config')7    cy.fixture('projects').as('projects')8    cy.fixture('projects_statuses').as('projectStatuses')9    cy.fixture('specs').as('specs')10    cy.fixture('runs').as('runs')11    cy.fixture('keys').as('keys')12    this.goToSettings = () => {13      cy.get('.navbar-default')14      cy.get('a').contains('Settings').click()15      // make sure the common sections are shown16      cy.get('.settings-config')17      cy.get('.settings-proxy')18    }19    cy.visitIndex().then(function (win) {20      let start = win.App.start21      this.win = win22      this.ipc = win.App.ipc23      cy.stub(this.ipc, 'getOptions').resolves({ projectRoot: '/foo/bar' })24      cy.stub(this.ipc, 'getCurrentUser').resolves(this.user)25      cy.stub(this.ipc, 'updaterCheck').resolves(false)26      cy.stub(this.ipc, 'getSpecs').yields(null, this.specs)27      cy.stub(this.ipc, 'closeBrowser').resolves()28      cy.stub(this.ipc, 'closeProject').resolves()29      cy.stub(this.ipc, 'pingApiServer').resolves()30      cy.stub(this.ipc, 'onConfigChanged')31      cy.stub(this.ipc, 'onFocusTests')32      cy.stub(this.ipc, 'externalOpen')33      cy.stub(this.ipc, 'setClipboardText')34      this.openProject = this.util.deferred()35      cy.stub(this.ipc, 'openProject').returns(this.openProject.promise)36      this.getProjectStatus = this.util.deferred()37      cy.stub(this.ipc, 'getProjectStatus').returns(this.getProjectStatus.promise)38      this.getRecordKeys = this.util.deferred()39      cy.stub(this.ipc, 'getRecordKeys').returns(this.getRecordKeys.promise)40      start()41    })42  })43  describe('general functionality', () => {44    beforeEach(function () {45      this.openProject.resolve(this.config)46      this.projectStatuses[0].id = this.config.projectId47      this.getProjectStatus.resolve(this.projectStatuses[0])48      this.goToSettings()49    })50    it('navigates to settings page', () => {51      cy.contains('Configuration')52    })53    it('highlight settings nav', () => {54      cy.contains('a', 'Settings').should('have.class', 'active')55    })56    it('collapses panels by default', function () {57      cy.contains('Your project\'s configuration is displayed').should('not.exist')58      cy.contains('Record Keys allow you to').should('not.exist')59      cy.contains(this.config.projectId).should('not.exist')60      cy.percySnapshot()61    })62    context('on:focus:tests clicked', () => {63      beforeEach(function () {64        this.ipc.onFocusTests.yield()65      })66      it('routes to specs page', () => {67        cy.shouldBeOnProjectSpecs()68      })69    })70  })71  /**72   * Opens "Configuration" panel of the Settings tab73   * and checks that configuration element is fully visible.74   * This helps to ensure no flake down the line75   */76  const openConfiguration = () => {77    cy.contains('Configuration').click()78    cy.get('.config-vars').should('be.visible')79    .invoke('height').should('be.gt', 400)80  }81  describe('configuration panel', () => {82    describe('displays config', () => {83      beforeEach(function () {84        this.openProject.resolve(this.config)85        this.projectStatuses[0].id = this.config.projectId86        this.getProjectStatus.resolve(this.projectStatuses[0])87        this.goToSettings()88        openConfiguration()89      })90      it('displays config section', () => {91        cy.contains('Your project\'s configuration is displayed')92      })93      it('displays browser information which is collapsed by default', () => {94        cy.contains('.config-vars', 'browsers')95        cy.get('.config-vars').invoke('text')96        .should('not.contain', '0:Chrome')97        cy.contains('span', 'browsers').parents('div').first().find('span').first().click()98        cy.get('.config-vars').invoke('text')99        .should('contain', '0:Chrome')100        cy.ensureAnimationsFinished()101        cy.percySnapshot()102      })103      it('removes the summary list of values once a key is expanded', () => {104        cy.contains('span', 'browsers').parents('div').first().find('span').first().click()105        cy.get('.config-vars').invoke('text')106        .should('not.contain', 'Chrome, Chromium')107        cy.get('.config-vars').invoke('text')108        .should('contain', '0:Chrome')109      })110      it('distinguishes between Arrays and Objects when expanded', () => {111        cy.get('.config-vars').invoke('text')112        .should('not.contain', 'browsers: Array (4)')113        cy.contains('span', 'browsers').parents('div').first().find('span').first().click()114        cy.get('.config-vars').invoke('text')115        .should('contain', 'browsers: Array (4)')116      })117      it('applies the same color treatment to expanded key values as the root key', () => {118        cy.contains('span', 'browsers').parents('div').first().find('span').first().click()119        cy.get('.config-vars').as('config-vars')120        .contains('span', 'Chrome').parent('span').should('have.class', 'plugin')121        cy.get('@config-vars')122        .contains('span', 'Chromium').parent('span').should('have.class', 'plugin')123        cy.get('@config-vars')124        .contains('span', 'Canary').parent('span').should('have.class', 'plugin')125        cy.get('@config-vars')126        .contains('span', 'Electron').parent('span').should('have.class', 'plugin')127        cy.contains('span', 'blockHosts').parents('div').first().find('span').first().click()128        cy.get('@config-vars')129        .contains('span', 'www.google-analytics.com').parent('span').should('have.class', 'config')130        cy.get('@config-vars')131        .contains('span', 'hotjar.com').parent('span').should('have.class', 'config')132        cy.contains('span', 'hosts').parents('div').first().find('span').first().click()133        cy.get('@config-vars')134        .contains('span', '127.0.0.1').parent('span').should('have.class', 'config')135        cy.get('@config-vars')136        .contains('span', '127.0.0.2').parent('span').should('have.class', 'config')137        cy.get('@config-vars')138        .contains('span', 'Electron').parents('div').first().find('span').first().click()139        cy.get('@config-vars').contains('span', 'electron').parents('li').eq(1).find('.line .plugin').should('have.length', 6)140      })141      it('displays string values as quoted strings', () => {142        cy.get('.config-vars').invoke('text')143        .should('contain', 'baseUrl:"http://localhost:8080"')144      })145      it('displays undefined and null without quotations', () => {146        cy.get('.config-vars').invoke('text')147        .should('not.contain', '"undefined"')148        .should('not.contain', '"null"')149      })150      it('does not show the root config label', () => {151        cy.get('.config-vars').find('> ol > li > div').should('have.css', 'display', 'none')152      })153      it('displays legend in table', () => {154        cy.get('table>tbody>tr').should('have.length', 6)155      })156      it('displays "true" values', () => {157        cy.get('.line').contains('true')158      })159      it('displays "null" values', () => {160        cy.get('.line').contains('null')161      })162      it('displays "object" values for env and hosts', () => {163        cy.get('.line').contains('www.google-analytics.com, hotjar.com')164        cy.get('.line').contains('*.foobar.com, *.bazqux.com')165      })166      it('displays "array" values for blockHosts', () => {167        cy.contains('.line', 'blockHosts').contains('www.google-analytics.com, hotjar.com')168      })169      it('opens help link on click', () => {170        cy.get('.settings-config .learn-more').click().then(function () {171          expect(this.ipc.externalOpen).to.be.calledWithMatch({ url: 'https://on.cypress.io/guides/configuration' })172        })173      })174      it('displays null when env settings are empty or not defined', function () {175        this.ipc.openProject.resolves(setConfigEnv(this.config, undefined))176        this.ipc.onConfigChanged.yield()177        cy.contains('.line', 'env:null').then(() => {178          this.ipc.openProject.resolves(this.config)179          this.ipc.onConfigChanged.yield()180          cy.contains('.line', 'env:fileServerFolder')181          .then(() => {182            this.ipc.openProject.resolves(setConfigEnv(this.config, null))183            this.ipc.onConfigChanged.yield()184            cy.contains('.line', 'env:null').then(() => {185              this.ipc.openProject.resolves(this.config)186              this.ipc.onConfigChanged.yield()187              cy.contains('.line', 'env:fileServerFolder')188              .then(() => {189                this.ipc.openProject.resolves(setConfigEnv(this.config, {}))190                this.ipc.onConfigChanged.yield()191                cy.contains('.line', 'env:null')192              })193            })194          })195        })196      })197      it('displays env settings', () => {198        cy.get('@config').then(({ resolved }) => {199          const getEnvKeys = flow([200            get('env'),201            toPairs,202            map(([key]) => key),203            sortBy(get('')),204          ])205          const assertKeyExists = each((key) => cy.contains('.line', key))206          const assertKeyValuesExists = flow([207            map((key) => {208              return flow([209                get(['env', key, 'value']),210                (v) => {211                  if (isString(v)) {212                    return `"${v}"`213                  }214                  return v215                },216              ])(resolved)217            }),218            each((v) => {219              cy.contains('.key-value-pair-value', v)220            }),221          ])222          const assertFromTooltipsExist = flow([223            map((key) => {224              return [key,225                flow([226                  get(['env', key, 'from']),227                  (from) => `.${from}`,228                ])(resolved)]229            }),230            each(([key, fromTooltipClassName]) => {231              cy.contains(key).parents('.line').first().find(fromTooltipClassName)232            }),233          ])234          cy.contains('.line', 'env').contains(flow([getEnvKeys, join(', ')])(resolved))235          cy.contains('.line', 'env').click()236          flow([getEnvKeys, assertKeyExists])(resolved)237          flow([getEnvKeys, assertKeyValuesExists])(resolved)238          flow([getEnvKeys, assertFromTooltipsExist])(resolved)239        })240      })241    })242    context('on config changes', () => {243      beforeEach(function () {244        this.projectStatuses[0].id = this.config.projectId245        this.getProjectStatus.resolve(this.projectStatuses[0])246        const newConfig = this.util.deepClone(this.config)247        newConfig.clientUrl = 'http://localhost:8888'248        newConfig.clientUrlDisplay = 'http://localhost:8888'249        newConfig.browsers = this.browsers250        this.openProject.resolve(newConfig)251        this.goToSettings()252        openConfiguration()253      })254      it('displays updated config', function () {255        const newConfig = this.util.deepClone(this.config)256        newConfig.resolved.baseUrl.value = 'http://localhost:7777'257        this.ipc.openProject.onCall(1).resolves(newConfig)258        this.ipc.onConfigChanged.yield()259        cy.contains('http://localhost:7777')260      })261    })262    context('when configFile is false', () => {263      beforeEach(function () {264        this.openProject.resolve(Cypress._.assign(this.config, {265          configFile: false,266        }))267        this.goToSettings()268        openConfiguration()269      })270      it('notes that cypress.json is disabled', () => {271        cy.contains('set from cypress.json file (currently disabled by --config-file false)')272      })273    })274    context('when configFile is set', function () {275      beforeEach(function () {276        this.openProject.resolve(Cypress._.assign(this.config, {277          configFile: 'special-cypress.json',278        }))279        this.goToSettings()280        openConfiguration()281      })282      it('notes that a custom config is in use', () => {283        cy.contains('set from custom config file special-cypress.json')284      })285    })286  })287  describe('project id panel', () => {288    context('with json file', () => {289      beforeEach(function () {290        this.openProject.resolve(this.config)291        this.projectStatuses[0].id = this.config.projectId292        this.getProjectStatus.resolve(this.projectStatuses[0])293        this.goToSettings()294        cy.contains('Project ID').click()295      })296      it('displays project id section', function () {297        cy.contains(this.config.projectId)298        cy.percySnapshot()299      })300      it('shows tooltip on hover of copy to clipboard', () => {301        cy.get('.action-copy').trigger('mouseover')302        cy.get('.cy-tooltip').should('contain', 'Copy to clipboard')303      })304      it('copies project id config to clipboard', function () {305        cy.get('.action-copy').click()306        .then(() => {307          const expectedJsonConfig = {308            projectId: this.config.projectId,309          }310          const expectedCopyCommand = JSON.stringify(expectedJsonConfig, null, 2)311          expect(this.ipc.setClipboardText).to.be.calledWith(expectedCopyCommand)312        })313      })314    })315    context('with js file', () => {316      beforeEach(function () {317        this.openProject.resolve({ ...this.config, configFile: 'custom.cypress.js' })318        this.projectStatuses[0].id = this.config.projectId319        this.getProjectStatus.resolve(this.projectStatuses[0])320        this.goToSettings()321        cy.contains('Project ID').click()322      })323      it('displays project id section', function () {324        cy.get('[data-cy="project-id"] pre').contains('module.exports = {')325        cy.percySnapshot()326      })327    })328  })329  describe('record key panel', () => {330    context('when project is set up and you have access', () => {331      beforeEach(function () {332        this.openProject.resolve(this.config)333        this.projectStatuses[0].id = this.config.projectId334        this.getProjectStatus.resolve(this.projectStatuses[0])335        this.goToSettings()336        cy.contains('Record Key').click()337      })338      it('displays record key section', () => {339        cy.contains('A Record Key sends')340      })341      it('opens ci guide when learn more is clicked', () => {342        cy.get('.settings-record-key').contains('Learn more').click().then(function () {343          expect(this.ipc.externalOpen).to.be.calledWithMatch({ url: 'https://on.cypress.io/what-is-a-record-key' })344        })345      })346      it('loads the projects record key', function () {347        expect(this.ipc.getRecordKeys).to.be.called348      })349      it('shows spinner', () => {350        cy.get('.settings-record-key .fa-spinner')351      })352      describe('when record key loads', () => {353        beforeEach(function () {354          this.getRecordKeys.resolve(this.keys)355        })356        it('displays first Record Key', function () {357          cy.get('.loading-record-keys').should('not.exist')358          cy.get('.settings-record-key')359          .contains(`cypress run --record --key ${this.keys[0].id}`)360          cy.percySnapshot()361        })362        it('shows tooltip on hover of copy to clipboard', () => {363          cy.get('.settings-record-key').find('.action-copy').trigger('mouseover')364          cy.get('.cy-tooltip').should('contain', 'Copy to clipboard')365        })366        it('copies record key command to clipboard', function () {367          cy.get('.settings-record-key').find('.action-copy').click()368          .then(() => {369            expect(this.ipc.setClipboardText).to.be.calledWith(`cypress run --record --key ${this.keys[0].id}`)370          })371        })372        it('opens admin project settings when record key link is clicked', () => {373          cy.get('.settings-record-key').contains('You can change').click().then(function () {374            expect(this.ipc.externalOpen).to.be.calledWith(`https://on.cypress.io/dashboard/projects/${this.config.projectId}/settings`)375          })376        })377      })378      describe('when there are no keys', () => {379        beforeEach(function () {380          this.getRecordKeys.resolve([])381        })382        it('displays empty message', () => {383          cy.get('.settings-record-key .empty-well').should('contain', 'This project has no record keys')384          cy.percySnapshot()385        })386        it('opens dashboard project settings when clicking \'Dashboard\'', () => {387          cy.get('.settings-record-key .empty-well a').click().then(function () {388            expect(this.ipc.externalOpen).to.be.calledWith(`https://on.cypress.io/dashboard/projects/${this.config.projectId}/settings`)389          })390        })391      })392      describe('when the user is logged out', () => {393        beforeEach(function () {394          this.getRecordKeys.resolve([])395          cy.logOut()396        })397        it('shows message that user must be logged in to view record keys', () => {398          cy.get('.empty-well').should('contain', 'must be logged in')399          cy.ensureAnimationsFinished()400          cy.percySnapshot()401        })402        it('opens login modal after clicking \'Log In\'', () => {403          cy.get('.empty-well button').click()404          cy.get('.login')405        })406        it('re-loads and shows the record key when user logs in', function () {407          cy.stub(this.ipc, 'beginAuth').resolves(this.user)408          this.ipc.getRecordKeys.onCall(1).resolves(this.keys)409          cy.get('.empty-well button').click()410          cy.contains('Log In to Dashboard').click().should(() => {411            expect(this.ipc.getRecordKeys).to.be.calledTwice412          })413          cy.get('.settings-record-key')414          .contains(`cypress run --record --key ${this.keys[0].id}`)415          // extra insurance that panel in background is fully expanded416          cy.contains('You can change this key')417          cy.ensureAnimationsFinished()418          cy.percySnapshot()419        })420      })421    })422    context('when project is not set up for CI', () => {423      it('does not show ci Keys section when project has no id', function () {424        const newConfig = this.util.deepClone(this.config)425        newConfig.projectId = null426        this.openProject.resolve(newConfig)427        this.getProjectStatus.resolve(this.projectStatuses)428        this.goToSettings()429        cy.contains('h5', 'Record Keys').should('not.exist')430        cy.percySnapshot()431      })432      it('does not show ci Keys section when project is invalid', function () {433        this.openProject.resolve(this.config)434        this.projectStatuses[0].state = 'INVALID'435        this.getProjectStatus.resolve(this.projectStatuses[0])436        this.goToSettings()437        cy.contains('h5', 'Record Keys').should('not.exist')438        cy.percySnapshot()439      })440    })441    context('when you are not a user of this projects org', () => {442      beforeEach(function () {443        this.openProject.resolve(this.config)444      })445      it('does not show record key', function () {446        this.projectStatuses[0].state = 'UNAUTHORIZED'447        this.getProjectStatus.resolve(this.projectStatuses[0])448        this.goToSettings()449        cy.contains('h5', 'Record Keys').should('not.exist')450      })451    })452  })453  describe('node version panel', () => {454    const bundledNodeVersion = '1.2.3'455    const systemNodePath = '/foo/bar/node'456    const systemNodeVersion = '4.5.6'457    beforeEach(function () {458      this.navigateWithConfig = function (config) {459        this.openProject.resolve(_.defaults(config, this.config))460        this.projectStatuses[0].id = this.config.projectId461        this.getProjectStatus.resolve(this.projectStatuses[0])462        this.goToSettings()463      }464    })465    it('with bundled node informs user we\'re using bundled node', function () {466      this.navigateWithConfig({})467      cy.contains(`Node.js Version (${bundledNodeVersion})`).click()468      cy.get('.node-version')469      .should('contain', 'bundled with Cypress')470      .should('not.contain', systemNodePath)471      .should('not.contain', systemNodeVersion)472      cy.percySnapshot()473    })474    it('with custom node displays path to custom node', function () {475      this.navigateWithConfig({476        resolvedNodePath: systemNodePath,477        resolvedNodeVersion: systemNodeVersion,478      })479      cy.contains(`Node.js Version (${systemNodeVersion})`).click()480      cy.get('.node-version')481      .should('contain', systemNodePath)482      .should('contain', systemNodeVersion)483      .should('not.contain', bundledNodeVersion)484    })485    it('should display an additional line when configFile is not JSON', function () {486      const configFile = 'notjson.js'487      this.navigateWithConfig({488        configFile,489      })490      cy.contains(`Node.js Version (${bundledNodeVersion})`).click()491      cy.get('.node-version li').should('contain', configFile)492    })493  })494  describe('proxy settings panel', () => {495    beforeEach(function () {496      this.openProject.resolve(this.config)497      this.config.resolved.baseUrl.value = 'http://localhost:7777'498      this.projectStatuses[0].id = this.config.projectId499      this.getProjectStatus.resolve(this.projectStatuses[0])500      this.goToSettings()501      cy.contains('Proxy Settings').click()502    })503    it('with no proxy config set informs the user no proxy configuration is active', () => {504      cy.get('.settings-proxy').should('contain', 'There is no active proxy configuration.')505    })506    it('opens help link on click', () => {507      cy.get('.settings-proxy .learn-more').click().then(function () {508        expect(this.ipc.externalOpen).to.be.calledWithMatch({ url: 'https://on.cypress.io/proxy-configuration' })509      })510    })511    it('with Windows proxy settings indicates proxy and the source', () => {512      cy.setAppStore({513        projectRoot: '/foo/bar',514        proxySource: 'win32',515        proxyServer: 'http://foo-bar.baz',516        proxyBypassList: 'a,b,c,d',517      })518      cy.get('.settings-proxy').should('contain', 'from Windows system settings')519      cy.get('.settings-proxy tr:nth-child(1) > td > code').should('contain', 'http://foo-bar.baz')520      cy.get('.settings-proxy tr:nth-child(2) > td > code').should('contain', 'a, b, c, d')521      cy.percySnapshot()522    })523    it('with environment proxy settings indicates proxy and the source', () => {524      cy.setAppStore({525        projectRoot: '/foo/bar',526        proxyServer: 'http://foo-bar.baz',527        proxyBypassList: 'a,b,c,d',528      })529    })530    it('with no bypass list but a proxy set shows \'none\' in bypass list', () => {531      cy.setAppStore({532        projectRoot: '/foo/bar',533        proxyServer: 'http://foo-bar.baz',534      })535      cy.get('.settings-proxy tr:nth-child(2) > td').should('contain', 'none')536    })537  })538  describe('experiments panel', () => {539    const hasNoExperimentsPanel = () => {540      // there are several settings panels,541      // let's make sure they are loaded542      cy.get('[class*=settings-]').should('have.length.gt', 1)543      // but the experiments panel should not be there at all544      cy.get('.settings-experiments').should('not.exist')545    }546    describe('no experimental features turned on', () => {547      beforeEach(function () {548        this.openProject.resolve(this.config)549        this.projectStatuses[0].id = this.config.projectId550        this.getProjectStatus.resolve(this.projectStatuses[0])551        this.goToSettings()552      })553      it('displays panel with no experiments', () => {554        hasNoExperimentsPanel()555        cy.percySnapshot()556      })557    })558    describe('unknown experiments', () => {559      beforeEach(function () {560        this.config.experimentalFoo = true561        this.config.resolved.experimentalFoo = {562          value: true,563        }564        this.openProject.resolve(this.config)565        this.projectStatuses[0].id = this.config.projectId566        this.getProjectStatus.resolve(this.projectStatuses[0])567        this.goToSettings()568      })569      it('are not shown', () => {570        hasNoExperimentsPanel()571      })572    })573    describe('experimental feature exists', () => {574      beforeEach(function () {575        // do not overwrite the shared object reference -576        // because it is used by the app's code.577        this.win.experimental.names.experimentalCoolFeature = 'Cool Feature'578        this.win.experimental.summaries.experimentalCoolFeature = 'Enables super cool feature from Cypress where you can see the cool feature'579      })580      const hasLearnMoreLink = () => {581        cy.get('[data-cy=experiments]').contains('a', 'Learn more').click()582        .then(function () {583          expect(this.ipc.externalOpen).to.be.calledWithMatch({ url: 'https://on.cypress.io/experiments' })584        })585      }586      context('enabled', () => {587        beforeEach(function () {588          this.config.experimentalCoolFeature = true589          this.config.resolved.experimentalCoolFeature = {590            value: true,591          }592          this.openProject.resolve(this.config)593          this.projectStatuses[0].id = this.config.projectId594          this.getProjectStatus.resolve(this.projectStatuses[0])595          this.goToSettings()596          cy.contains('Experiments').click()597        })598        it('has learn more link', hasLearnMoreLink)599        it('displays experiment', () => {600          cy.get('.settings-experiments').contains('Cool Feature')601          cy.get('.experiment-status-sign')602          .should('have.class', 'enabled')603          .and('have.text', 'enabled')604          cy.percySnapshot()605        })606      })607      context('disabled', () => {608        beforeEach(function () {609          this.config.experimentalCoolFeature = false610          this.config.resolved.experimentalCoolFeature = {611            value: false,612            from: 'default',613          }614          this.openProject.resolve(this.config)615          this.projectStatuses[0].id = this.config.projectId616          this.getProjectStatus.resolve(this.projectStatuses[0])617          this.goToSettings()618          cy.contains('Experiments').click()619        })620        it('displays experiment', () => {621          cy.get('.settings-experiments').contains('Cool Feature')622          cy.get('.experiment-status-sign')623          .should('have.class', 'disabled')624          .and('have.text', 'disabled')625          cy.percySnapshot()626        })627      })628    })629  })630  describe('file preference panel', () => {631    const availableEditors = [632      { id: 'atom', name: 'Atom', isOther: false, openerId: 'atom' },633      { id: 'vim', name: 'Vim', isOther: false, openerId: 'vim' },634      { id: 'sublime', name: 'Sublime Text', isOther: false, openerId: 'sublime' },635      { id: 'vscode', name: 'Visual Studio Code', isOther: false, openerId: 'vscode' },636      { id: 'other', name: 'Other', isOther: true, openerId: '' },637    ]638    beforeEach(function () {639      this.getUserEditor = this.util.deferred()640      cy.stub(this.ipc, 'getUserEditor').returns(this.getUserEditor.promise)641      cy.stub(this.ipc, 'setUserEditor').resolves()642      this.openProject.resolve(this.config)643      this.projectStatuses[0].id = this.config.projectId644      this.getProjectStatus.resolve(this.projectStatuses[0])645      this.goToSettings()646      cy.contains('File Opener Preference').click()647    })648    it('displays file preference section', () => {649      cy.contains('Your preference is used to open files')650    })651    it('opens file preference guide when learn more is clicked', () => {652      cy.get('.file-preference').contains('Learn more').click().then(function () {653        expect(this.ipc.externalOpen).to.be.calledWithMatch({ url: 'https://on.cypress.io/file-opener-preference' })654      })655    })656    it('loads preferred editor, available editors and shows spinner', () => {657      cy.get('.loading-editors').then(function () {658        expect(this.ipc.getUserEditor).to.be.called659      })660    })661    describe('when editors load with preferred editor', () => {662      beforeEach(function () {663        this.getUserEditor.resolve({ availableEditors, preferredOpener: availableEditors[3] })664      })665      it('displays available editors with preferred one selected', () => {666        cy.get('.loading-editors').should('not.exist')667        cy.contains('Atom')668        cy.contains('Other')669        cy.contains('Visual Studio Code').closest('li').should('have.class', 'is-selected')670      })671      it('sets editor through ipc when a different editor is selected', function () {672        cy.contains('Atom').click()673        .closest('li').should('have.class', 'is-selected')674        cy.wrap(this.ipc.setUserEditor).should('be.calledWith', availableEditors[0])675        cy.percySnapshot()676      })677    })678    describe('when editors load without preferred editor', () => {679      beforeEach(function () {680        this.getUserEditor.resolve({ availableEditors })681      })682      it('does not select an editor', () => {683        cy.get('.loading-editors').should('not.exist')684        cy.get('.editor-picker li').should('not.have.class', 'is-selected')685      })686    })687  })688  describe('errors', () => {689    const errorText = 'An unexpected error occurred'690    beforeEach(function () {691      this.err = {692        message: 'Port \'2020\' is already in use.',693        name: 'Error',694        port: 2020,695        portInUse: true,696        stack: '[object Object]âµ  at Object.API.get (/Users/jennifer/Dev/Projects/cypress-app/lib/errors.coffee:55:15)âµ  at Object.wrapper [as get] (/Users/jennifer/Dev/Projects/cypress-app/node_modules/lodash/lodash.js:4414:19)âµ  at Server.portInUseErr (/Users/jennifer/Dev/Projects/cypress-app/lib/server.coffee:58:16)âµ  at Server.onError (/Users/jennifer/Dev/Projects/cypress-app/lib/server.coffee:86:19)âµ  at Server.g (events.js:273:16)âµ  at emitOne (events.js:90:13)âµ  at Server.emit (events.js:182:7)âµ  at emitErrorNT (net.js:1253:8)âµ  at _combinedTickCallback (internal/process/next_tick.js:74:11)âµ  at process._tickDomainCallback (internal/process/next_tick.js:122:9)âµFrom previous event:âµ    at fn (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:57919:14)âµ    at Object.appIpc [as ipc] (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:57939:10)âµ    at openProject (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:59135:24)âµ    at new Project (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:58848:34)âµ    at ReactCompositeComponentMixin._constructComponentWithoutOwner (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:44052:27)âµ    at ReactCompositeComponentMixin._constructComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:44034:21)âµ    at ReactCompositeComponentMixin.mountComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:43953:21)âµ    at Object.ReactReconciler.mountComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:51315:35)âµ    at ReactCompositeComponentMixin.performInitialMount (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:44129:34)âµ    at ReactCompositeComponentMixin.mountComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:44016:21)âµ    at Object.ReactReconciler.mountComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:51315:35)âµ    at ReactDOMComponent.ReactMultiChild.Mixin._mountChildAtIndex (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:50247:40)âµ    at ReactDOMComponent.ReactMultiChild.Mixin._updateChildren (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:50163:43)âµ    at ReactDOMComponent.ReactMultiChild.Mixin.updateChildren (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:50123:12)âµ    at ReactDOMComponent.Mixin._updateDOMChildren (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:45742:12)âµ    at ReactDOMComponent.Mixin.updateComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:45571:10)âµ    at ReactDOMComponent.Mixin.receiveComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:45527:10)âµ    at Object.ReactReconciler.receiveComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:51396:22)âµ    at ReactCompositeComponentMixin._updateRenderedComponent (file:///Users/jennifer/Dev/Projects/cypress-core-desktop-gui/dist/app.js:44547:23)',697        type: 'PORT_IN_USE_SHORT',698      }699      this.config.resolved.baseUrl.value = 'http://localhost:7777'700      this.projectStatuses[0].id = this.config.projectId701      this.getProjectStatus.resolve(this.projectStatuses[0])702      this.openProject.resolve(this.config)703      this.goToSettings()704      openConfiguration()705      cy.contains('http://localhost:7777').then(() => {706        this.ipc.openProject.onCall(1).rejects(this.err)707        this.ipc.onConfigChanged.yield()708      })709    })710    it('displays errors', () => {711      cy.contains(errorText)712      cy.percySnapshot()713    })714    it('displays config after error is fixed', function () {715      cy.contains(errorText).then(() => {716        this.ipc.openProject.onCall(1).resolves(this.config)717        this.ipc.onConfigChanged.yield()718      })719      cy.contains('Configuration')720    })721  })722})723// --724function setConfigEnv (config, v) {725  return flow([726    merge(config),727    set('resolved.env', v),728  ])({})...

projects-api.js

Source:projects-api.js

...183  project.update(projectDetails)184  saveToLocalStorage()185}186const getRecordKeys = () => {187  return ipc.getRecordKeys()188  .catch(ipc.isUnauthed, ipc.handleUnauthed)189  // ignore error, settle for no keys190  .catch(() => {191    return []192  })193}194export default {195  loadProjects,196  updateProjectStatus,197  openProject,198  reopenProject,199  closeProject,200  addProject,201  removeProject,...

open_project.js

Source:open_project.js

1(function() {2  var Project, Promise, _, browsers, config, create, files, log,3    slice = [].slice;4  _ = require("lodash");5  Promise = require("bluebird");6  files = require("./controllers/files");7  config = require("./config");8  Project = require("./project");9  browsers = require("./browsers");10  log = require('./log');11  create = function() {12    var openProject, relaunchBrowser, reset, specIntervalId, tryToCall;13    openProject = null;14    specIntervalId = null;15    relaunchBrowser = null;16    reset = function() {17      openProject = null;18      return relaunchBrowser = null;19    };20    tryToCall = function(method) {21      return function() {22        var args;23        args = 1 <= arguments.length ? slice.call(arguments, 0) : [];24        if (openProject) {25          return openProject[method].apply(openProject, args);26        } else {27          return Promise.resolve(null);28        }29      };30    };31    return {32      reset: tryToCall("reset"),33      getConfig: tryToCall("getConfig"),34      createCiProject: tryToCall("createCiProject"),35      getRecordKeys: tryToCall("getRecordKeys"),36      getRuns: tryToCall("getRuns"),37      requestAccess: tryToCall("requestAccess"),38      emit: tryToCall("emit"),39      getProject: function() {40        return openProject;41      },42      launch: function(browserName, spec, options) {43        if (options == null) {44          options = {};45        }46        log("launching browser %s spec %s", browserName, spec);47        return this.reset().then(function() {48          return openProject.ensureSpecUrl(spec);49        }).then(function(url) {50          return openProject.getConfig().then(function(cfg) {51            var am, automation;52            options.browsers = cfg.browsers;53            options.proxyUrl = cfg.proxyUrl;54            options.userAgent = cfg.userAgent;55            options.proxyServer = cfg.proxyUrl;56            options.socketIoRoute = cfg.socketIoRoute;57            options.chromeWebSecurity = cfg.chromeWebSecurity;58            options.url = url;59            automation = openProject.getAutomation();60            if (am = options.automationMiddleware) {61              automation.use(am);62            }63            return (relaunchBrowser = function() {64              log("launching project in browser " + browserName);65              return browsers.open(browserName, options, automation);66            })();67          });68        });69      },70      getSpecChanges: function(options) {71        var checkForSpecUpdates, currentSpecs, get, sendIfChanged;72        if (options == null) {73          options = {};74        }75        currentSpecs = null;76        _.defaults(options, {77          onChange: function() {},78          onError: function() {}79        });80        sendIfChanged = function(specs) {81          if (specs == null) {82            specs = [];83          }84          if (_.isEqual(specs, currentSpecs)) {85            return;86          }87          currentSpecs = specs;88          return options.onChange(specs);89        };90        checkForSpecUpdates = (function(_this) {91          return function() {92            if (!openProject) {93              return _this.clearSpecInterval();94            }95            return get().then(sendIfChanged)["catch"](options.onError);96          };97        })(this);98        get = function() {99          return openProject.getConfig().then(function(cfg) {100            return files.getTestFiles(cfg);101          });102        };103        specIntervalId = setInterval(checkForSpecUpdates, 2500);104        return checkForSpecUpdates();105      },106      clearSpecInterval: function() {107        if (specIntervalId) {108          clearInterval(specIntervalId);109          return specIntervalId = null;110        }111      },112      closeBrowser: function() {113        return browsers.close();114      },115      closeOpenProjectAndBrowsers: function() {116        return Promise.all([this.closeBrowser(), openProject ? openProject.close() : void 0]).then(function() {117          reset();118          return null;119        });120      },121      close: function() {122        log("closing opened project");123        this.clearSpecInterval();124        return this.closeOpenProjectAndBrowsers();125      },126      create: function(path, args, options) {127        if (args == null) {128          args = {};129        }130        if (options == null) {131          options = {};132        }133        openProject = Project(path);134        _.defaults(options, {135          onReloadBrowser: (function(_this) {136            return function(url, browser) {137              if (relaunchBrowser) {138                return relaunchBrowser();139              }140            };141          })(this)142        });143        options = _.extend({}, args.config, options);144        return browsers.get().then(function(b) {145          if (b == null) {146            b = [];147          }148          options.browsers = b;149          log("opening project %s", path);150          return openProject.open(options);151        })["return"](this);152      }153    };154  };155  module.exports = create();156  module.exports.Factory = create;...

Using AI Code Generation

1Cypress.Commands.add('getRecordKeys', (record) => {2    return Cypress._.keys(record)3})4Cypress.Commands.add('getRecordValues', (record) => {5    return Cypress._.values(record)6})7Cypress.Commands.add('getRecordKeysAndValues', (record) => {8    return Cypress._.zipObject(Cypress._.keys(record), Cypress._.values(record))9})10Cypress.Commands.add('getRecordValuesAndKeys', (record) => {11    return Cypress._.zipObject(Cypress._.values(record), Cypress._.keys(record))12})13Cypress.Commands.add('getRecordLength', (record) => {14    return Cypress._.size(record)15})16Cypress.Commands.add('getRecordLength', (record) => {17    return Cypress._.size(record)18})19Cypress.Commands.add('getRecordLength', (record) => {20    return Cypress._.size(record)21})22Cypress.Commands.add('getRecordLength', (record) => {23    return Cypress._.size(record)24})25Cypress.Commands.add('getRecordLength', (record) => {26    return Cypress._.size(record)27})28Cypress.Commands.add('getRecordLength', (record) => {29    return Cypress._.size(record)30})31Cypress.Commands.add('getRecordLength', (record) => {32    return Cypress._.size(record)33})34Cypress.Commands.add('getRecordLength', (record) => {35    return Cypress._.size(record)36})37Cypress.Commands.add('getRecordLength', (record) => {

Using AI Code Generation

1describe('test', () => {2    it('test', () => {3        cy.getRecordKeys().then((keys) => {4            expect(keys).to.be.an('array');5            expect(keys.length).to.be.greaterThan(0);6        });7    });8});9Cypress.Commands.add('getRecordKeys', () => {10        .window()11        .then((win) => {12                .get('c:recordView')13                .get('lightning-record-view-form')14                .get('lightning-record-edit-form')15                .get('lightning-record-edit-form-section')16                .get('[data-output-element-id]')17                .get(

Using AI Code Generation

1describe('My First Test', function() {2  it('Get record keys', function() {3    cy.getRecordKeys().then((keys) => {4      console.log(keys);5    })6  })7})

Using AI Code Generation

1describe('Test to get all record keys', function(){2    it('Get all record keys', function(){3        cy.getRecordKeys().then((keys) => {4            console.log(keys)5        })6    })7})

Using AI Code Generation

1cy.getRecordKeys().then((keys)=>{2    expect(keys).to.have.length(3);3    expect(keys).to.include('name');4    expect(keys).to.include('id');5    expect(keys).to.include('email');6})7cy.getRecordValues().then((values)=>{8    expect(values).to.have.length(3);9    expect(values).to.include('John');10    expect(values).to.include('1');11    expect(values).to.include('

Using AI Code Generation

1describe('Get Record Keys', () => {2    it('Get Record Keys', () => {3        cy.getRecordKeys('Contact').then((recordKeys) => {4            console.log(recordKeys)5        })6    })7})8Cypress.Commands.add('getRecordKeys', (objectName, options = {}) => {9    return cy.request({10        headers: {11        },12    }).then((response) => {13        for (var i = 0; i < response.body.records.length; i++) {14            recordKeys.push(response.body.records[i].Id)15        }16    })17})18import './commands'19{20    "env": {

Using AI Code Generation

1describe('API Test', () => {2  it('API Test', () => {3    cy.request({4    }).then((response) => {5      expect(response.status).to.eq(200)6      const keys = Cypress._.keys(response.body)7      cy.log(keys)8      cy.log(response.body[keys[0]])9      cy.log(response.body[keys[1]])10      cy.log(response.body[keys[2]])11      cy.log(response.body[keys[3]])12      cy.log(response.body[keys[4]])13      cy.log(response.body[keys[5]])14    })15  })16})17describe('API Test', () => {18  it('API Test', () => {19    cy.request({20    }).then((response) => {21      expect(response.status).to.eq(200)22      const keys = Cypress._.keys(response.body)23      cy.log(keys)24      cy.log(response.body[keys[0]])25      cy.log(response.body[keys[1]])26      cy.log(response.body[keys[2]])27      cy.log(response.body[keys[3]])28      cy.log(response.body[keys[4]])29      cy.log(response.body[keys[5]])30    })31  })32})

Using AI Code Generation

1import { getRecordKeys } from "./getRecordKeys.js";2cy.fixture("test.json").then((json) => {3  const keys = getRecordKeys(json);4  console.log(keys);5});6export function getRecordKeys(json) {7  let keys = [];8  for (let key in json) {9    keys.push(key);10  }11  return keys;12}13{14}15{16}17import { getRecordKeys } from "../../getRecordKeys.js";18cy.fixture("test.json").then((json) => {19  const keys = getRecordKeys(json);20  console.log(keys);21});22export function getRecordKeys(json) {23  let keys = [];24  for (let key in json) {25    keys.push(key);26  }27  return keys;28}

Cypress Tutorial

Cypress is a renowned Javascript-based open-source, easy-to-use end-to-end testing framework primarily used for testing web applications. Cypress is a relatively new player in the automation testing space and has been gaining much traction lately, as evidenced by the number of Forks (2.7K) and Stars (42.1K) for the project. LambdaTest’s Cypress Tutorial covers step-by-step guides that will help you learn from the basics till you run automation tests on LambdaTest.

Chapters:

What is Cypress? -
Why Cypress? - Learn why Cypress might be a good choice for testing your web applications.
Features of Cypress Testing - Learn about features that make Cypress a powerful and flexible tool for testing web applications.
Cypress Drawbacks - Although Cypress has many strengths, it has a few limitations that you should be aware of.
Cypress Architecture - Learn more about Cypress architecture and how it is designed to be run directly in the browser, i.e., it does not have any additional servers.
Browsers Supported by Cypress - Cypress is built on top of the Electron browser, supporting all modern web browsers. Learn browsers that support Cypress.
Selenium vs Cypress: A Detailed Comparison - Compare and explore some key differences in terms of their design and features.
Cypress Learning: Best Practices - Take a deep dive into some of the best practices you should use to avoid anti-patterns in your automation tests.
How To Run Cypress Tests on LambdaTest? - Set up a LambdaTest account, and now you are all set to learn how to run Cypress tests.

Certification

You can elevate your expertise with end-to-end testing using the Cypress automation framework and stay one step ahead in your career by earning a Cypress certification. Check out our Cypress 101 Certification.