From 76a06b09c2f8cf6ca75a4262a6d83ccb865410a6 Mon Sep 17 00:00:00 2001 From: Nina Eilers Date: Sat, 21 Dec 2024 18:34:42 +0100 Subject: [PATCH] To make test files readable --- .vscode/launch.json | 2 ++ package.json | 1 + tests/conf/parallel.conf.js | 3 +- tests/specs-todo/search-by-shop.js | 51 ++++++++++++++++++++++++++++++ tests/specs/highlighted-marker.js | 4 +-- tests/specs/search-by-name.js | 20 ++++++++---- 6 files changed, 72 insertions(+), 9 deletions(-) create mode 100644 tests/specs-todo/search-by-shop.js diff --git a/.vscode/launch.json b/.vscode/launch.json index 567b9620f..44e413f7e 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -4,6 +4,8 @@ // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ + + { "name": "Launch localhost", "type": "chrome", diff --git a/package.json b/package.json index 11d5b2cd0..49185f73a 100644 --- a/package.json +++ b/package.json @@ -161,6 +161,7 @@ "copy-files": "copyfiles -u 1 ./src/**/*.css ./dist && copyfiles -u 1 ./src/**/*.scss ./dist && copyfiles ./public ./dist", "analyze": "source-map-explorer build/static/js/main.*", "test": "wdio run tests/conf/parallel.conf.js", + "test-live-app": "CI_TEST_GIT_REF=production CI_TEST_GIT_SHA1=12345678 BROWSERSTACK_LOCAL=0 CI_DEPLOYMENT_TEST_URL=https://wheelmap.org npm run test", "version": "echo TODO: Add version syncing to bundle configurations for native apps + git commit -am 'Version bump' to package.json", "server": "server", "push-translations": "rm -rf src/.next/ && npx ttag update public/i18n/translations.pot ./src && tx push -s && echo \"Translators can now start translating new strings:\\n\\nhttps://www.transifex.com/sozialhelden/wheelmap-react-frontend/translate/#de/translationspot/335454735?q=translated%3Ano\"", diff --git a/tests/conf/parallel.conf.js b/tests/conf/parallel.conf.js index 5793c4d27..72b9adf08 100644 --- a/tests/conf/parallel.conf.js +++ b/tests/conf/parallel.conf.js @@ -36,7 +36,8 @@ checkEnvironmentVariables(); // https://github.com/browserstack/webdriverio-browserstack exports.config = { - user: process.env.BROWSERSTACK_USERNAME, + user: process.env.BROWSERSTACK_USERNAME, + bail: 1, key: process.env.BROWSERSTACK_ACCESS_KEY, services: [ diff --git a/tests/specs-todo/search-by-shop.js b/tests/specs-todo/search-by-shop.js new file mode 100644 index 000000000..8a80b6130 --- /dev/null +++ b/tests/specs-todo/search-by-shop.js @@ -0,0 +1,51 @@ +const IdPropertyName = 'element-6066-11e4-a52e-4f735466dfgh'; +const saveScreenshot = require('../lib/saveScreenshot'); +const getCurrentUrl = require('../lib/getCurrentUrl'); +const acceptLocationAlertOnMobilesIfPresent = require('../lib/acceptLocationAlertOnMobilesIfPresent'); + +// See the WebDriver API documentation for a list of possible actions. +// https://webdriver.io/docs/api.html +// https://github.com/webdriverio/expect-webdriverio/blob/HEAD/docs/API.md + +// See the Mocha API for test structure: https://mochajs.org/ +describe('Searching a shop', function() { + it('delivers results', async function() { + await browser.url('/'); + + await acceptLocationAlertOnMobilesIfPresent(); + + const $button = await $('button=Okay, let’s go!'); + await $button.click(); + + const { capabilities } = browser; + if (capabilities.platformName === 'iOS' || capabilities.platform === 'ANDROID') { + const $searchButtonOnMobile = await $('.search-button'); + await $searchButtonOnMobile.waitForExist(); + await $searchButtonOnMobile.click(); + } + + + const $search = await $('[name="search"]'); + await $search.click(); + await (await $('[name="search"]')).addValue('Bötzowstr. 31'); + $results = await $('.search-results'); + await saveScreenshot('Search results are loading'); + + await browser.waitUntil(async () => { + + return $('.search-results').isExisting(); + }); + + // Wait for wheelchair accessibility to be loaded + await browser.waitUntil( + async () => await (await $results.$('header.is-on-wheelmap=Bötzowstr. 31')).isDisplayed() + ); + + + const $result = await $results.$('header=Bötzowstr. 31'); + await expect($results).toBeDisplayedInViewport(); + await saveScreenshot('Search results are displayed'); + + + }); +}); \ No newline at end of file diff --git a/tests/specs/highlighted-marker.js b/tests/specs/highlighted-marker.js index be8d75107..e429a2086 100644 --- a/tests/specs/highlighted-marker.js +++ b/tests/specs/highlighted-marker.js @@ -17,11 +17,11 @@ describe('Highlighted marker', function() { await $button.click(); const $placeInfoPanel = await $('.toolbar[aria-label="Berlin Alexanderplatz"]'); - const $placeName = await $placeInfoPanel.$('h1=Berlin Alexanderplatz'); + const $placeName = await $placeInfoPanel.$('div=Berlin Alexanderplatz'); await expect($placeName).toBeDisplayedInViewport(); await saveScreenshot('After opening'); - const $highlightedMarker = await $('a.highlighted-marker[aria-label="Berlin Alexanderplatz Fully wheelchair accessible"]'); + const $highlightedMarker = await $('a.highlighted-marker[aria-label="Berlin Alexanderplatz, Fully wheelchair accessible"]'); await expect($highlightedMarker).toBeDisplayedInViewport(); await saveScreenshot('Marker visible'); }); diff --git a/tests/specs/search-by-name.js b/tests/specs/search-by-name.js index 2d8c88768..732e59d23 100644 --- a/tests/specs/search-by-name.js +++ b/tests/specs/search-by-name.js @@ -10,7 +10,10 @@ const acceptLocationAlertOnMobilesIfPresent = require('../lib/acceptLocationAler // See the Mocha API for test structure: https://mochajs.org/ describe('Searching a place by name', function() { + it('delivers results', async function() { + await browser.setTimeout({ 'implicit': 100000 }); + await browser.url('/'); await acceptLocationAlertOnMobilesIfPresent(); @@ -27,14 +30,16 @@ describe('Searching a place by name', function() { const $search = await $('[name="search"]'); await $search.click(); - await browser.waitUntil(async () => { - const el = await browser.findElement('css selector', 'a[href="/search?category=food"]'); - return el && el[IdPropertyName]; - }); await saveScreenshot('Category and accessibility filter is shown'); await (await $('[name="search"]')).addValue('alexanderplatz'); + await browser.waitUntil(async () => { + return $('.search-results').isExisting(); + }); + + browser.findElement('css selector', '.search-results'); const $results = await $('.search-results'); + await expect($results).toBeDisplayedInViewport(); await saveScreenshot('Search results are loading'); @@ -48,13 +53,16 @@ describe('Searching a place by name', function() { await saveScreenshot('Search results show their accessibility'); + await browser.waitUntil(async () => { + return $results.$('header=Berlin Alexanderplatz').isExisting(); + }); const $resultAfterSearch = await $results.$('header=Berlin Alexanderplatz'); + await $resultAfterSearch.waitForClickable(); await $resultAfterSearch.click(); await browser.waitUntil(async () => (await getCurrentUrl()).match(/\/node\//)); - const results = await browser.findElement('css selector', '.search-results'); - await expect(results[IdPropertyName]).toBeUndefined(); + const $placeInfoPanel = await $('.toolbar[aria-label~="Alexanderplatz"'); const $placeName = await $placeInfoPanel.$('h1*=Alexanderplatz'); await expect($placeName).toBeDisplayedInViewport();