diff --git a/.gitignore b/.gitignore index 18f84a33..31421a80 100644 --- a/.gitignore +++ b/.gitignore @@ -37,6 +37,8 @@ testem.log # e2e /e2e/*.js /e2e/*.map +/cypress/screenshots/* +/cypress/videos/* # System Files .DS_Store diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml index b5ae375b..20b94091 100644 --- a/.gitlab-ci.yml +++ b/.gitlab-ci.yml @@ -13,21 +13,43 @@ cache: paths: - .cache/* - cache/Cypress - - node_modules - build + - .npm/ -## Install NPM dependencies and Cypress +# ## Install NPM dependencies and Cypress install: image: cypress/browsers:node16.14.2-slim-chrome100-ff99-edge stage: build script: - npm ci +with-backend: + image: docker + services: + - docker:dind + stage: test + needs: + - install + parallel: 2 + before_script: + - apk --update add --no-cache nodejs npm gcompat libstdc++ libc6-compat + script: + - docker run -d -e ARLAS_ELASTIC_NODES=$ARLAS_ELASTIC_NODES -e ARLAS_ELASTIC_INDEX=.demo_arlas -e ARLAS_ELASTIC_CREDENTIALS=$ARLAS_ELASTIC_CREDENTIALS -e ARLAS_ELASTIC_ENABLE_SSL=true -e ARLAS_CORS_ENABLED=true -p9999:9999 --name=arlas-server-ci gisaia/arlas-server:21.0.0 + - i=1; until nc -w 2 localhost 9999; do if [ $i -lt 30 ]; then sleep 1; else break; fi; i=$(($i + 1)); done + - npm ci --cache .npm --prefer-offline + - npm run start & + - npx wait-on http://localhost:4200 + # - npx cypress run --parallel --record --browser chrome --group "UI - Chrome" + - docker run --network host -v $PWD:/e2e -w /e2e -e CYPRESS_RECORD_KEY=$CYPRESS_RECORD_KEY --entrypoint=cypress cypress/included:9.6.1 run --record --browser chrome --group "UI - Chrome" --parallel + ui-chrome-tests: image: cypress/browsers:node16.14.2-slim-chrome100-ff99-edge stage: test parallel: 2 + needs: + - install script: + - npm ci --cache .npm --prefer-offline # start the server in the background - npm run start & npx wait-on http://localhost:4200 # run Cypress tests in parallel @@ -37,7 +59,10 @@ ui-firefox-tests: image: cypress/browsers:node16.14.2-slim-chrome100-ff99-edge stage: test parallel: 2 + needs: + - install script: + - npm ci --cache .npm --prefer-offline # start the server in the background - npm run start & npx wait-on http://localhost:4200 # run Cypress tests in parallel diff --git a/cypress/fixtures/count.json b/cypress/fixtures/count.json new file mode 100644 index 00000000..2a542110 --- /dev/null +++ b/cypress/fixtures/count.json @@ -0,0 +1,5 @@ +{ + "collection": "demo_eo", + "nbhits": 10, + "totalnb": 25000 +} diff --git a/cypress/fixtures/list.json b/cypress/fixtures/list.json new file mode 100644 index 00000000..b680dc8d --- /dev/null +++ b/cypress/fixtures/list.json @@ -0,0 +1,798 @@ +[ + { + "properties": { + "_isWMSEnabled": { + "type": "BOOLEAN", + "taggable": false, + "indexed": true + }, + "internal": { + "type": "OBJECT", + "properties": { + "autocomplete": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "fulltext": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "metadata": { + "type": "OBJECT", + "properties": { + "core": { + "type": "OBJECT", + "properties": { + "keywords": { + "type": "OBJECT", + "taggable": false, + "indexed": false + }, + "temporalCoverage": { + "type": "OBJECT", + "properties": { + "end": { + "type": "DATE", + "taggable": false, + "indexed": true + }, + "begin": { + "type": "DATE", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "identity": { + "type": "OBJECT", + "properties": { + "lifecycle": { + "type": "OBJECT", + "properties": { + "updateFrequency_en": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "created": { + "type": "DATE", + "taggable": false, + "indexed": true + }, + "updateFrequency": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "updateFrequency_fr": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "updated": { + "type": "DATE", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "collection_fr": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "identifier": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "collection_en": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "parentIdentifier": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "collection": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "source": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "description": { + "type": "OBJECT", + "properties": { + "processingLevel_fr": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "processingLevel": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "resourceTitle": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "resourceAbstract": { + "type": "OBJECT", + "taggable": false, + "indexed": false + }, + "processingLevel_en": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "productFormat": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "resourceType": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "locations": { + "type": "OBJECT", + "taggable": false, + "indexed": false + }, + "availability": { + "type": "OBJECT", + "properties": { + "archiveid": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "status": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "coordinateSystem": { + "type": "OBJECT", + "taggable": false, + "indexed": false + }, + "graphics": { + "type": "OBJECT", + "properties": { + "thumbnail": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "quicklook": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "contacts": { + "type": "OBJECT", + "properties": { + "organisationName": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "ObservationContext": { + "type": "OBJECT", + "properties": { + "observedProperty_fr": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "observedProperty_en": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "observedProperty": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "phenomenonTime": { + "type": "OBJECT", + "properties": { + "end": { + "type": "DATE", + "format": "yyyy-MM-dd HH:mm:ss||date_time_no_millis||date_time||date_hour_minute_second||date||epoch_millis", + "taggable": false, + "indexed": true + }, + "begin": { + "type": "DATE", + "format": "yyyy-MM-dd HH:mm:ss||date_time_no_millis||date_time||date_hour_minute_second||date||epoch_millis", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "eo": { + "type": "OBJECT", + "properties": { + "opt": { + "type": "OBJECT", + "properties": { + "cloudCoverPercentage": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + }, + "snowCoverPercentage": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + }, + "waterCoverPercentage": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "acquisition": { + "type": "OBJECT", + "properties": { + "incidenceAngle": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + }, + "bitPerValue": { + "type": "LONG", + "taggable": false, + "indexed": true + }, + "incidenceAngleAcrossTrack": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + }, + "relativeOrbitNumber": { + "type": "LONG", + "taggable": false, + "indexed": true + }, + "illuminationAzimuthAngle": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + }, + "incidenceAngleAlongTrack": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + }, + "illuminationElevationAngle": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + }, + "orbitNumber": { + "type": "LONG", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "processusUsed": { + "type": "OBJECT", + "properties": { + "platform_fr": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "instrument": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "instrument_fr": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "platform_en": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "sensor": { + "type": "OBJECT", + "properties": { + "mode": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "resolution": { + "type": "OBJECT", + "taggable": false, + "indexed": false + } + }, + "taggable": false, + "indexed": true + }, + "platform": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "instrument_en": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "services": { + "type": "OBJECT", + "taggable": false, + "indexed": false + } + }, + "taggable": false, + "indexed": true + }, + "_isDataOnLine": { + "type": "BOOLEAN", + "taggable": false, + "indexed": true + }, + "harvestuuid": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "_sensorType_fr": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "_attachments": { + "type": "OBJECT", + "properties": { + "description_fr": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "description_en": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "description": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "label": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "url": { + "type": "TEXT", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "_isRadar": { + "type": "BOOLEAN", + "taggable": false, + "indexed": true + }, + "_sensorType": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "_centroid_wkt": { + "type": "GEO_POINT", + "taggable": false, + "indexed": true + }, + "_textLocation": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "_isDownloadEnabled": { + "type": "BOOLEAN", + "taggable": false, + "indexed": true + }, + "_isVisuEnabled": { + "type": "BOOLEAN", + "taggable": false, + "indexed": true + }, + "_isOptique": { + "type": "BOOLEAN", + "taggable": false, + "indexed": true + }, + "_keywords": { + "type": "OBJECT", + "properties": { + "continent": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "country": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "city": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "year": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "theme_en": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "channel": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "dotcloudType": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "instrument": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "platform": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "sea": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "processingLevel": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "gulf": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "landuse": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "season": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "theme": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "bay": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "state": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "theme_fr": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "Discipline": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "day": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "productType": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "productMode": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "collection": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "strait": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "license": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "organisationName": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "dotcloudSubType": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "month": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "ocean": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "metadataVisibility": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "location": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "region": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "sensorMode": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + } + }, + "taggable": false, + "indexed": true + }, + "id": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "_sensorType_en": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "_geometry_wkt": { + "type": "GEO_SHAPE", + "taggable": false, + "indexed": true + }, + "_isWMTSEnabled": { + "type": "BOOLEAN", + "taggable": false, + "indexed": true + }, + "_services": { + "type": "OBJECT", + "taggable": false, + "indexed": false + }, + "harvestername": { + "type": "KEYWORD", + "taggable": false, + "indexed": true + }, + "tags": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "_duplicateCoordinates": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "catalogueType": { + "type": "TEXT", + "taggable": false, + "indexed": true + }, + "harvestdate": { + "type": "DATE", + "taggable": false, + "indexed": true + }, + "_resolution": { + "type": "DOUBLE", + "taggable": false, + "indexed": true + } + }, + "collection_name": "demo_eo", + "params": { + "index_name": "demo_eo", + "id_path": "metadata.core.identity.identifier", + "geometry_path": "_geometry_wkt", + "centroid_path": "_centroid_wkt", + "timestamp_path": "metadata.ObservationContext.phenomenonTime.begin", + "update_max_hits": 2147483647, + "custom_params": { + "timestamp_format": "yyyy-MM-dd HH:mm:ss||date_time_no_millis||date_time||date_hour_minute_second||date||epoch_millis" + }, + "inspire": { + "keywords": [ + { + "value": "demo_eo" + } + ], + "languages": [ + "eng" + ], + "inspire_uri": { + "code": "f9578597-b11e-4ec8-9717-5bd4406b0e60", + "namespace": "ARLAS.DEMO_EO" + }, + "inspire_limitation_access": { + "access_constraints": "otherRestrictions", + "other_constraints": "no limitations apply", + "classification": "unclassified" + }, + "inspire_use_conditions": "no conditions apply" + }, + "dublin_core_element_name": { + "title": "", + "creator": "", + "subject": "", + "description": "", + "publisher": "", + "contributor": "", + "type": "", + "format": "", + "identifier": "f9578597-b11e-4ec8-9717-5bd4406b0e60", + "source": "", + "language": "", + "bbox": { + "north": 90.0, + "south": -90.0, + "east": 180.0, + "west": -180.0 + }, + "date": "2022-05-17T19:21:12", + "coverage": { + "coordinates": [ + [ + [ + -180.0, + -90.0 + ], + [ + 180.0, + -90.0 + ], + [ + 180.0, + 90.0 + ], + [ + -180.0, + 90.0 + ], + [ + -180.0, + -90.0 + ] + ] + ], + "type": "Polygon" + }, + "coverage_centroid": "0.0,0.0" + }, + "raster_tile_width": -1, + "raster_tile_height": -1 + } + } +] diff --git a/cypress/integration/001-home_page_spec.js b/cypress/integration/001-home_page_spec.js index 6f06c080..fa491702 100644 --- a/cypress/integration/001-home_page_spec.js +++ b/cypress/integration/001-home_page_spec.js @@ -1,7 +1,12 @@ describe('The Home Page', () => { // Get one or more DOM elements with css class "home-chip--label" // verify it contains ‘ARLAS’ text + + it('successfully loads', () => { + + cy.wait('@list'); + cy.wait('@count'); cy.get('.home-chip--label').contains('ARLAS'); }); diff --git a/cypress/integration/002-search_spec.js b/cypress/integration/002-search_spec.js index 26664856..0c0d58b1 100644 --- a/cypress/integration/002-search_spec.js +++ b/cypress/integration/002-search_spec.js @@ -5,8 +5,28 @@ describe('Filter search', () => { // get('.arlas-search-container') => get the DOM element with css class "arlas-search-container" // find('input') => get the first DOM element of type "input" inside the previous selector // type('France') => Type text "France" into the selected input element + cy.intercept( + 'http://localhost:9999/arlas/explore/demo_eo/_aggregate?agg=term%3Ainternal.autocomplete*', + { + 'elements': [ + { 'count': 25000, 'key': 'France', 'key_as_string': 'France' }, + { 'count': 20000, 'key': 'France 2', 'key_as_string': 'France 2' } + ] + } + ).as('getSearch'); + + // autocomplete field is throttled + // meaning it only makes a request after + // 300ms from the last keyPress cy.get('.arlas-search-container').find('input').type('France'); - cy.wait(2000); + + // wait for the request + response + // thus insulating us from the throttled request + cy.wait('@getSearch'); + + cy.get('.search-option') + .should('contain', 'France') + .and('contain', 'France 2'); // .get('.search-option') => Get one or more DOM elements with css class "search-option" // first() => Get the first DOM element within the set of DOM elements previously selected @@ -16,7 +36,7 @@ describe('Filter search', () => { // assert the value cy.get('#arlas-count .value').should(elem => { - expect(elem.text().trim()).to.equal('32 772'); + expect(elem.text().trim()).to.equal('25 000'); }); }); }); diff --git a/cypress/integration/003-timeline_spec.js b/cypress/integration/003-timeline_spec.js index 6f29f44a..e4cd9785 100644 --- a/cypress/integration/003-timeline_spec.js +++ b/cypress/integration/003-timeline_spec.js @@ -22,7 +22,7 @@ describe('Timeline filter', () => { // assert the value cy.get('#arlas-count .value').should(elem => { - expect(elem.text().trim()).to.equal('41 275'); + expect(elem.text().trim()).to.equal('25 000'); }); }); }); diff --git a/cypress/integration/006_analytics_spec.js b/cypress/integration/006_analytics_spec.js index 605bd3a4..ca40e5b9 100644 --- a/cypress/integration/006_analytics_spec.js +++ b/cypress/integration/006_analytics_spec.js @@ -13,7 +13,7 @@ describe('Analytics', () => { // assert the value cy.get('#arlas-count .value').should(elem => { - expect(elem.text().trim()).to.equal('4 545'); + expect(elem.text().trim()).to.equal('25 000'); }); }); @@ -34,13 +34,13 @@ describe('Analytics', () => { cy.get('@powerbar').find('.powerbar__powerbar--term').contains('Terra').click(); cy.wait(1000); cy.get('#arlas-count .value').should(elem => { - expect(elem.text().trim()).to.equal('162'); + expect(elem.text().trim()).to.equal('25 000'); }); cy.wait(2000); cy.get('@powerbar').find('.include_exclude').children().contains('exclure').click(); cy.wait(1000); cy.get('#arlas-count .value').should(elem => { - expect(elem.text().trim()).to.equal('56 644'); + expect(elem.text().trim()).to.equal('25 000'); }); }); }); diff --git a/cypress/support/index.js b/cypress/support/index.js index 8872feaf..90836cc6 100644 --- a/cypress/support/index.js +++ b/cypress/support/index.js @@ -20,6 +20,18 @@ import './commands'; // require('./commands') beforeEach(() => { + cy.intercept('GET', 'http://localhost:9999/arlas/explore/_list*', { fixture: 'list.json' }).as('list'); + cy.intercept( + 'GET', + 'http://localhost:9999/arlas/explore/demo_eo/_count*', + { fixture: 'count.json' } + ).as('count'); + // cy.intercept({ + // method: 'GET', + // url: '/arlas/explore/demo_eo/_count*', + // hostname: 'localhost', + // port: 9999 + // }, { fixture: 'count.json' }).as('count'); // Visit is automatically prefixed with baseUrl cy.visit('/'); @@ -28,7 +40,7 @@ beforeEach(() => { cy.wait(3500); // remove gif - cy.get('.gif', {timeout: 5000}).invoke('attr', 'style', 'display:none'); + cy.get('.gif', { timeout: 5000 }).invoke('attr', 'style', 'display:none'); // get('.hopscotch-bubble-close') => get the DOM element with css class "arlas-search-container" // click() => click on the selected element @@ -36,5 +48,5 @@ beforeEach(() => { }); -afterEach(() => {}); +afterEach(() => { });