Skip to content

Commit

Permalink
chore(e2e): adds localStorage setup and teardown step (#3030)
Browse files Browse the repository at this point in the history
Adds a gherkin step to add values to localStorage:

```gherkin
Given the localStorage
  """
    key:
        this:
           will: end
           up: json
           encoded: true     
  """
```
The root key will be the localStorage key, and the rest will get JSON
stringified and used for the value. So the above will be:

```
| Key | Value                                                   |
| key | {"this": { will: "end", "up": "json", "encoded": true}} | 
```

We never use anything but this form of JSON encoding, and we shouldn't
ever use anything else either.

---

I also combined `visit.ts` here. We used to have this separate for
reasons, but we no longer need it to be separate. (ln:103 down is just
the contents of the deleted file)

Signed-off-by: John Cowen <john.cowen@konghq.com>
  • Loading branch information
johncowen authored Oct 25, 2024
1 parent 825e56d commit 04713ab
Show file tree
Hide file tree
Showing 2 changed files with 57 additions and 41 deletions.
58 changes: 57 additions & 1 deletion cypress/support/step_definitions/index.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { When, Then, Before, Given, DataTable } from '@badeball/cypress-cucumber-preprocessor'
import { When, Then, Before, Given, DataTable, After } from '@badeball/cypress-cucumber-preprocessor'
import jsYaml, { DEFAULT_SCHEMA, Type } from 'js-yaml'

import { useServer, useMock, useClient } from '../../services'
Expand All @@ -24,13 +24,20 @@ const YAML = {

let env = {}
let selectors: Record<string, string> = {}
let localStorage: Set<string>
const client = useClient()
Before(() => {
client.reset()
env = {}
selectors = {}
localStorage = new Set()
useServer()
})
After(() => {
Array.from(localStorage).forEach((key) => {
window.localStorage.removeItem(key)
})
})

const negativeTimeout = parseInt(Cypress.env().KUMA_NEGATIVE_TIMEOUT) || 4000
const timeout = (negative: boolean) => negative ? { timeout: negativeTimeout } : {}
Expand Down Expand Up @@ -69,6 +76,15 @@ Given('the environment', (yaml: string) => {
cy.setCookie(key, String(value))
})
})

Given('the localStorage', (yaml: string) => {
const obj = YAML.parse(yaml) as object
Object.entries(obj).forEach(([key, value]) => {
window.localStorage.setItem(key, JSON.stringify(value))
localStorage.add(key)
})
})

Given('the URL {string} responds with', (url: string, yaml: string) => {
const mock = useMock()
mock(url, env, (respond) => {
Expand All @@ -84,6 +100,46 @@ Given('the URL {string} responds with', (url: string, yaml: string) => {

// act

When('I visit the {string} URL', function (path: string) {
// turn off MSW in dev environments so we can use cy.intercept
cy.setCookie('KUMA_MOCK_API_ENABLED', 'false')
//

cy.getAllCookies().then((cookies) => {
cy.visit(`${path}`)
cy.get('#kuma-config').then((obj) => {
const node = obj.get(0)
if (node === null || node.textContent === null) {
throw new Error('#kuma-config not found')
}
const config = JSON.parse(node.textContent)
cookies.forEach(item => {
switch (item.name) {
case 'KUMA_VERSION':
config.version = item.value
break
case 'KUMA_MODE':
config.mode = item.value
break
case 'KUMA_ENVIRONMENT':
config.environment = item.value
break
case 'KUMA_STORE_TYPE':
config.storeType = item.value
break
}
})
node.textContent = JSON.stringify(config)
})
})
// currently use this to denote "the page has initially rendered"
cy.get('[data-testid-root="mesh-app"]').should('be.visible')
})

When('I load the {string} URL', function (path: string) {
cy.visit(`${path}`)
})

// TODO(jc): we can probably combine these 2 steps
When(/^I click the "(.*)" element(?: and select "(.*)")?$/, (selector: string, value?: string) => {
const event = 'click'
Expand Down
40 changes: 0 additions & 40 deletions cypress/support/step_definitions/visit.ts

This file was deleted.

0 comments on commit 04713ab

Please sign in to comment.