diff --git a/tests/cypress/e2e/databrowser.cy.js b/tests/cypress/e2e/databrowser.cy.js index eac921d..7b5eef1 100644 --- a/tests/cypress/e2e/databrowser.cy.js +++ b/tests/cypress/e2e/databrowser.cy.js @@ -1,4 +1,5 @@ import { retryableBefore } from "../support/retryableBefore.js" +import { stringToArray } from "../support/stringToArray.js" const browseCategories = ['dataset', 'model', 'simulation'] @@ -10,25 +11,25 @@ const pageLimit = Cypress.env('PAGE_LIMIT') /** * List of keywords */ -const searchKeywords = [...new Set(Cypress.env('SEARCH_KEYWORDS').split(',').map(item => item.trim()).filter(item => item))] +const searchKeywords = stringToArray(Cypress.env('SEARCH_KEYWORDS'), ',') let filterFacets = [] /** * Single facet */ -const filterFacet = [...new Set(Cypress.env('FILTER_FACET').split(',').map(item => item.trim()).filter(item => item))] +const filterFacet = stringToArray(Cypress.env('FILTER_FACET'), ',') if (filterFacet && filterFacet.length === 1) { filterFacets.push(filterFacet) } /** * List of facets */ -const multipleFilterFacets = [...new Set(Cypress.env('MULTIPLE_FILTER_FACETS').split(',').map(item => item.trim()).filter(item => item))] +const multipleFilterFacets = stringToArray(Cypress.env('MULTIPLE_FILTER_FACETS'), ',') if (multipleFilterFacets && multipleFilterFacets.length > 1) { filterFacets.push(multipleFilterFacets) } -browseCategories.forEach((category) => { +browseCategories.forEach((category, bcIndex) => { describe(`Find Data in ${category}`, { testIsolation: false }, function () { retryableBefore(function () { @@ -141,19 +142,20 @@ browseCategories.forEach((category) => { cy.waitForLoadingMask() // Check for result - cy.get(':nth-child(1) > p').then(($result) => { - if ($result.text().includes(' 0 Results | Showing')) { + cy.get('.el-col-md-16 > :nth-child(1) > p').then(($result) => { + if ($result.text().match(/^0 Results \| Showing/i)) { // Empty text should exist if no result cy.get('.el-table__empty-text').should('exist').and('have.text', 'No Results') + this.skip() } else { cy.get('.table-wrap').then(($content) => { const keywordExist = $content.text().toLowerCase().includes(keyword.toLowerCase()) if (keywordExist) { // Check for keyword - cy.wrap($content).contains(new RegExp(keyword, 'i')).should('exist') + cy.wrap($content).contains(new RegExp(`^${keyword}$`, 'i')).should('exist') // Check for highlighted keyword - cy.get('b').contains(new RegExp(keyword, 'i')).should('exist') + cy.get('b').contains(new RegExp(`^${keyword}$`, 'i')).should('exist') } else { // *** Ignore when keyword cannot be found or // *** Find some other solutions in the future @@ -172,6 +174,13 @@ browseCategories.forEach((category) => { filterFacets.forEach((facetList) => { it(`Faceted Browse Search - ${facetList}`, function () { + // Clear search input + cy.url().then((url) => { + if (url.includes('search=')) { + cy.get('.nuxt-icon.nuxt-icon--fill.body1.close-icon').click() + } + }) + // Check for filters applied box cy.get('.no-facets').should('contain', 'No filters applied') @@ -205,7 +214,7 @@ browseCategories.forEach((category) => { }) // Check for the number of facet tags in filters applied box - cy.get('.el-card__body > .capitalize:visible').contains(new RegExp(facet, 'i')).should('exist') + cy.get('.el-card__body > .capitalize:visible').contains(new RegExp(`^${facet}$`, 'i')).should('exist') }) // Check for URL @@ -215,8 +224,8 @@ browseCategories.forEach((category) => { cy.waitForLoadingMask() // Check for result correctness - cy.get(':nth-child(1) > p').then(($result) => { - if ($result.text().includes('0 Results | Showing')) { + cy.get('.el-col-md-16 > :nth-child(1) > p').then(($result) => { + if ($result.text().match(/^0 Results \| Showing/i)) { // Empty text should exist if no result cy.get('.el-table__empty-text').should('exist').and('have.text', 'No Results') } else { @@ -225,7 +234,7 @@ browseCategories.forEach((category) => { facetList.forEach((facet) => { const facetExistInCard = $content.text().toLowerCase().includes(facet.toLowerCase()) if (facetExistInCard) { - cy.wrap($content).contains(new RegExp(facet, 'i')).should('exist') + cy.wrap($content).contains(new RegExp(`^${facet}$`, 'i')).should('exist') } else { // *** Ignore when facets cannot be found or // *** Find some other solutions in the future @@ -236,7 +245,7 @@ browseCategories.forEach((category) => { }) for (let index = 0; index < 2; index++) { - if (index === 1) { + if (bcIndex = 0 && index === 1) { // Combine with search cy.get('.el-input__inner').clear() cy.get('.el-input__inner').type('dataset') diff --git a/tests/cypress/e2e/datasets.cy.js b/tests/cypress/e2e/datasets.cy.js index 3367538..83c4180 100644 --- a/tests/cypress/e2e/datasets.cy.js +++ b/tests/cypress/e2e/datasets.cy.js @@ -1,9 +1,10 @@ import { retryableBefore } from "../support/retryableBefore.js" +import { stringToArray } from "../support/stringToArray.js" /** * List of dataset ids */ -const datasetIds = [...new Set(Cypress.env('DATASET_IDS').split(',').map(item => item.trim()).filter(item => item))] +const datasetIds = stringToArray(Cypress.env('DATASET_IDS'), ',') datasetIds.forEach(datasetId => { @@ -157,7 +158,7 @@ datasetIds.forEach(datasetId => { // Check for Experimental Design cy.get('.dataset-description-info > .mb-8').contains('Experimental Design:').should('exist') cy.get('.dataset-description-info').contains('Protocol Links:').should('exist') - cy.get('.dataset-description-info').within(($el) => { + cy.get('.dataset-description-info').contains(/Protocol Links:/i).parents('.experimental-design-container').within(($el) => { if ($el.text().includes('https://doi.org/')) { cy.get('.link2').should('exist') cy.get('.link2').should('have.length.above', 0) diff --git a/tests/cypress/e2e/homepage.cy.js b/tests/cypress/e2e/homepage.cy.js index 0a586af..c6d0c48 100644 --- a/tests/cypress/e2e/homepage.cy.js +++ b/tests/cypress/e2e/homepage.cy.js @@ -5,11 +5,7 @@ describe('Homepage', { testIsolation: false }, function () { cy.visitLoadedPage('') }) - beforeEach(function () { - cy.intercept('**/query?**').as('query') - }) - - it(`Portal Target is ${Cypress.config().baseUrl}`, function () { }) + it(`Testing Portal Target: ${Cypress.config().baseUrl}`, function () { }) it('Navigation Bar', function () { // Check for navigation bar @@ -22,34 +18,39 @@ describe('Homepage', { testIsolation: false }, function () { }) it('Page hero', function () { - // Check for banner - cy.get('h1').should('contain', 'SPARC') - cy.get('[class="page-hero-img"]').should('exist') + // Check for page hero + cy.get('.page-hero').should('exist').within(() => { + // Check for content title + cy.get('h1').should('exist').and('contain', 'SPARC') + + // Check for content description + cy.get('h5').should('exist') + + // Check for content image + cy.get('[class="page-hero-img"]').should('exist').and('have.prop', 'naturalWidth').should('be.greaterThan', 0) + }) }) - it('Featured data', function () { + it('SPARC by the numbers', function () { // Check for content title - cy.get('.featured-data > .categories-container > h2').should('have.text', 'Find by') + cy.get('.container.p-32 > .heading2').should('exist').and('contain', 'SPARC by the numbers') - cy.wait(5000) - - cy.get('.featured-data > .gallery > .resources-gallery-strip > .card-line > .key-image-span > .data-wrap > .data-item').as('category') + // Check for consortia + cy.get('.container.p-32 > .body1 > b > .heading2').first().should('exist').then(($el) => { + const numberOfConsortia = parseInt($el.text()) - cy.get('@category').each(($cat) => { - cy.wrap($cat).should('have.attr', 'href').and('contain', 'selectedFacetIds') + cy.get('.container.p-32 > .data-wrap.py-16 > .consortia-item').should('have.length', numberOfConsortia) + cy.get('.container.p-32 > .data-wrap.py-16 > .consortia-item').should('have.attr', 'href').and('contain', '/about/consortia/') }) - cy.get('@category').first().click() - - cy.wait('@query', { timeout: 20000 }) - cy.waitForLoadingMask() - cy.url().should('contain', 'data?type=dataset&selectedFacetIds=') - cy.go('back') + // Check for contributor + cy.get('.container.p-32 > .body1 > b > .heading2').last().should('exist').then(($el) => { + const numberOfContributor = parseInt($el.text()) + expect(numberOfContributor).to.be.greaterThan(0) - cy.waitForLoadingMask() - - // Check for the number of categories - cy.get('@category').should('have.length', 6) + cy.get('.container.p-32 > .data-wrap.pt-16 > .consortia-item').should('have.length.above', 0) + cy.get('.container.p-32 > .data-wrap.pt-16 > .consortia-item').should('have.attr', 'href').and('contain', '/data?type=') + }) }) it('Portal features', function () { @@ -64,26 +65,38 @@ describe('Homepage', { testIsolation: false }, function () { cy.get('.button-link > .el-button > span').should('exist') }) - // Check for button function - cy.get(':nth-child(1) > .feature-container > .button-link > .el-button').click() + // Check for button link + cy.get(':nth-child(1) > .feature-container > .button-link').should('contain', 'Data and Models').and('have.attr', 'href', '/data?type=dataset') + cy.get(':nth-child(2) > .feature-container > .button-link').should('contain', 'Maps').and('have.attr', 'href', '/maps') + cy.get(':nth-child(3) > .feature-container > .button-link').should('contain', 'Discover').and('have.attr', 'href').and('contain', '/resources') + cy.get(':nth-child(4) > .feature-container > .button-link').should('contain', 'Submit').and('have.attr', 'href', '/share-data') + }) - cy.wait('@query', { timeout: 20000 }) - cy.waitForLoadingMask() + it('Find by', function () { + cy.get('.categories-container > .heading2').should('have.text', 'Find by') - cy.url().should('contain', 'data?type=dataset') - cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a', { timeout: 30000 }).should('have.class', 'active') - cy.go('back') + // Check for categories selection item + cy.get('.categories-container > .categories-select').click() + cy.get('.el-select-dropdown > .el-scrollbar > .el-select-dropdown__wrap > .el-select-dropdown__list > .el-select-dropdown__item').should('have.length.above', 0) + cy.get('.categories-container > .categories-select').click() - cy.waitForLoadingMask() + cy.wait(5000) + cy.get('.featured-data > .gallery > .resources-gallery-strip > .card-line > .key-image-span > .data-wrap > .data-item').should('have.attr', 'href').and('contain', '/data?type=dataset&selectedFacetIds=') + + // Check for pagination + cy.get('.sparc-design-system-pagination').should('exist') + cy.get('.is-active').should('contain', '1') + cy.get('.btn-next').click() + cy.get('.is-active').should('contain', '2') }) - it('Projects and datasets', function () { + it('Resources and datasets', function () { // Check for content title cy.get('.section-container.py-32 > .heading2').should('contain', 'Resources & Datasets') // Check for card description - cy.get('.row > :nth-child(1) > .mb-16').should('contain', 'you might be interested in:') + cy.get('.row > :nth-child(1) > .mb-16').should('contain', 'Here is a resource you might be interested in:') cy.get('.row > :nth-child(2) > .mb-16').should('have.text', 'Featured Datasets') // Check for card content @@ -94,27 +107,16 @@ describe('Homepage', { testIsolation: false }, function () { cy.get('.subpage-row > :nth-child(2) > .button-link > .el-button').should('exist') }) - // Check for card 'view all' link - cy.get('.row > :nth-child(1) > .view-all-link').should('contain', 'View All') - cy.get(':nth-child(2) > .view-all-link').should('contain', 'View All Datasets') - - // Check for button redirect to dataset - cy.get(':nth-child(2) > .card-container > .subpage-row > :nth-child(2) > .dataset-name').then(($link) => { - const title = $link.text().replace('\n', '').trim() - cy.wrap($link).siblings('.button-link').click() - - cy.wait('@query', { timeout: 20000 }) - cy.waitForLoadingMask() + // Check for title redirect link + cy.get(':nth-child(1) > .card-container > .subpage-row > :nth-child(2) > .dataset-name').should('have.attr', 'href').and('contain', '/resources/') + cy.get(':nth-child(2) > .card-container > .subpage-row > :nth-child(2) > .dataset-name').should('have.attr', 'href').and('contain', '/datasets/') - cy.get('.el-col-sm-16 > .heading2').should('contain', title) - }) - cy.go('back') - - cy.waitForLoadingMask() + // Check for card 'view all' link + cy.get('.row > :nth-child(1) > .view-all-link').should('contain', 'View All Tools & Resources').and('have.attr', 'href', '/tools-and-resources/tools') + cy.get(':nth-child(2) > .view-all-link').should('contain', 'View All Datasets').and('have.attr', 'href', '/data?type=dataset') }) - it('Homepage news', function () { - cy.visitLoadedPage('') + it('News and upcoming events', function () { // Check for content title cy.get('.featured-datasets > .heading2').should('contain', 'News & Upcoming Events') @@ -129,7 +131,7 @@ describe('Homepage', { testIsolation: false }, function () { cy.get(':nth-child(2) > .el-button').should('contain', 'Learn More') // Check for card 'view all' link - cy.get('.sparc-card__content-wrap__content > .view-all-link').should('exist') + cy.get('.sparc-card__content-wrap__content > .view-all-link').should('contain', 'View All News & Events').and('have.attr', 'href', '/news-and-events') }) it('Stay connected', function () { diff --git a/tests/cypress/e2e/mapsviewer.cy.js b/tests/cypress/e2e/mapsviewer.cy.js index 7d5f9bf..e5f8aa8 100644 --- a/tests/cypress/e2e/mapsviewer.cy.js +++ b/tests/cypress/e2e/mapsviewer.cy.js @@ -1,15 +1,16 @@ import { retryableBefore } from "../support/retryableBefore.js" +import { stringToArray } from "../support/stringToArray.js" // x: The distance in pixels from the element's left // y: The distance in pixels from the element's top -// central coordinate { 'x': 768, 'y': 373 } +// central coordinate around { 'x': 768, 'y': 373 } const coordinate = { 'x': 800, 'y': 333 } const pixelChange = 3 /** * Human Female, Human Male, Rat, Mouse, Pig, Cat */ -const taxonModels = [...new Set(Cypress.env('TAXON_MODELS').split(',').map(item => item.trim()).filter(item => item))] +const taxonModels = stringToArray(Cypress.env('TAXON_MODELS'), ',') let loadedModels = new Set() /** @@ -20,7 +21,7 @@ const threeDSyncView = Cypress.env('THREE_SYNC_VIEW') const searchInMap = Cypress.env('SEARCH_IN_MAP') -const scaffoldDatasetIds = [...new Set(Cypress.env('SCAFFOLD_DATASET_IDS').split(',').map(item => item.trim()).filter(item => item))] +const scaffoldDatasetIds = stringToArray(Cypress.env('SCAFFOLD_DATASET_IDS'), ',') describe('Maps Viewer', { testIsolation: false }, function () { retryableBefore(function () { @@ -28,37 +29,33 @@ describe('Maps Viewer', { testIsolation: false }, function () { }) beforeEach(function () { - cy.intercept('**/flatmap/**').as('flatmap') - cy.intercept('**/get_body_scaffold_info/**').as('get_body_scaffold_info') - cy.intercept('**/s3-resource/**').as('s3-resource') cy.intercept('**/query?**').as('query') + cy.intercept('**/flatmap/**').as('flatmap') cy.intercept('**/dataset_info/**').as('dataset_info') cy.intercept('**/datasets/**').as('datasets') + cy.intercept('**/get_body_scaffold_info/**').as('get_body_scaffold_info') + cy.intercept('**/s3-resource/**').as('s3-resource') }) taxonModels.forEach((model, index) => { it(`Provenance card for ${model}`, function () { - - cy.wait(['@flatmap', '@query', '@dataset_info', '@datasets'], { timeout: 20000 }) - cy.waitForLoadingMask() - if (index === 0) { + cy.wait(['@query', '@flatmap', '@dataset_info', '@datasets'], { timeout: 20000 }) + cy.waitForLoadingMask() loadedModels.add('Rat') } // Switch to the second flatmap - cy.get('.el-select.select-box.el-tooltip__trigger.el-tooltip__trigger', { timeout: 30000 }).click() + cy.get('.el-select.select-box.el-tooltip__trigger.el-tooltip__trigger').click({ force: true }) cy.get('.el-select-dropdown__item').should('be.visible') - cy.get('.el-select-dropdown__item:visible').contains(new RegExp(model, 'i')).click({ force: true }) - - if (!loadedModels.has(model)) { - - cy.wait(['@flatmap', '@query', '@dataset_info', '@datasets'], { timeout: 20000 }) - cy.waitForLoadingMask() - - loadedModels.add(model) - } + cy.get('.el-select-dropdown__item:visible').contains(new RegExp(model, 'i')).click({ force: true }).then(() => { + if (!loadedModels.has(model)) { + cy.wait(['@flatmap'], { timeout: 20000 }) + cy.waitForLoadingMask() + loadedModels.add(model) + } + }) // Hide organs and outlines cy.get('.settings-group > :nth-child(2):visible').click({ waitForAnimations: false }) @@ -66,24 +63,71 @@ describe('Maps Viewer', { testIsolation: false }, function () { cy.get('.settings-group > :nth-child(2):visible').click({ waitForAnimations: false }) cy.get('[style="height: 100%;"] > [style="height: 100%; width: 100%; position: relative;"] > [style="height: 100%; width: 100%;"] > .maplibregl-touch-drag-pan > .maplibregl-canvas').as('canvas'); + // Open a provenance card - cy.clickNeuron(coordinate, pixelChange) + cy.clickOnNeuron(coordinate, pixelChange) + + // Check for the sidebar tabs + cy.get('.title-text-table > .title-text').should('have.length', 2) + cy.get(':nth-child(2) > .title-text-table > .title-text').as('Connectivity') + cy.get('.active-tab > .title-text-table > .title-text').as('ActiveTab') + cy.get('@ActiveTab').should('contain', 'Connectivity') + + // Check for the provenance content + cy.get('.connectivity-info-title').within(($content) => { + cy.get('.block > .title').should('exist') + cy.get('.block > .subtitle').should('exist') + cy.get('.el-button').should('exist') + + // Check for button click + if ($content.text().includes('Open publications in PubMed')) { + cy.window().then((window) => { + cy.stub(window, 'open').as('Open') + }) + cy.get('#open-pubmed-button').click() + cy.get('@Open').should('have.been.calledOnceWithExactly', Cypress.sinon.match(/^https:\/\/pubmed\.ncbi\.nlm\.nih\.gov(?:\/.*)/), '_blank') + cy.get('@Open').should('be.calledWith', Cypress.sinon.match.string).then((stub) => { + const url = stub.args[0][0] + const termUrl = decodeURIComponent(url.slice(url.indexOf("?term="))); + const invalidTermFound = ['pubmed', 'doi.org'].some(term => termUrl.includes(term)) + expect(!invalidTermFound, 'Should not contain pubmed or doi.org').to.be.true + }) + } + }) - cy.visit('/maps?type=ac') + // Check for the provenance content + cy.get('.sidebar-container > .main > .content-container').then(($content) => { + cy.wrap($content).get('.attribute-title-container').should('exist') + + // Check for button click + const buttonTexts = ['Explore origin data', 'Explore destination data', 'Search for data on components'] + buttonTexts.forEach((text) => { + if ($content.text().includes(text)) { + cy.contains(/Explore destination data/i).click({force: true}) + cy.get('@ActiveTab').should('contain', 'Search') + cy.get('@Connectivity').click({force: true}) + cy.get('@ActiveTab').should('contain', 'Connectivity') + } + }) + }) + + // Close the provenance card + cy.get('.active-tab > .el-button').click() + cy.get('.sidebar-container > .tab-container').should('not.exist') + cy.get('.close-tab > .el-icon').click() }) }) it(`From 2D ${threeDSyncView}, open 3D map for synchronised view and Search within display`, function () { - - cy.wait(['@flatmap', '@query', '@dataset_info', '@datasets'], { timeout: 20000 }) - cy.waitForLoadingMask() - // Switch to the human related flatmap - cy.get('.el-select.select-box.el-tooltip__trigger.el-tooltip__trigger', { timeout: 30000 }).click() cy.get('.el-select-dropdown__item').contains(new RegExp(threeDSyncView, 'i')).click({ force: true }) - - cy.wait(['@flatmap', '@query', '@dataset_info', '@datasets'], { timeout: 20000 }) - cy.waitForLoadingMask() + cy.get('.el-select.select-box.el-tooltip__trigger.el-tooltip__trigger').click({ force: true }).then(() => { + if (!loadedModels.has(threeDSyncView)) { + cy.wait(['@flatmap'], { timeout: 20000 }) + cy.waitForLoadingMask() + loadedModels.add(threeDSyncView) + } + }) // Open the 3D view in a split viewer cy.get('.settings-group > :nth-child(1):visible').contains(/Open new map/i).should('exist') @@ -116,15 +160,11 @@ describe('Maps Viewer', { testIsolation: false }, function () { // Check for keyword(highlighted part) in displayed viewers cy.get('.maplibregl-popup-content').contains(new RegExp(searchInMap, 'i')).should('exist') - cy.visit('/maps?type=ac') }) scaffoldDatasetIds.forEach((datasetId) => { it(`Context card in sidebar for scaffold dataset ${datasetId}`, function () { - - cy.waitForLoadingMask() - // Open the sidebar cy.get('.open-tab > .el-icon').click() diff --git a/tests/cypress/e2e/userstories.cy.js b/tests/cypress/e2e/userstories.cy.js deleted file mode 100644 index e034bc6..0000000 --- a/tests/cypress/e2e/userstories.cy.js +++ /dev/null @@ -1,165 +0,0 @@ -// To check the segmentation card -// should use datasets which have segmentation data -const segmentationDatasetIds = [226, 77] -const scaffoldDatasetCategories = ['pig colon', 'pig heart'] -const categories = ['stomach', 'lung'] - -describe('User stories', function () { - describe('Should find segmentation in the gallery', { testIsolation: false }, function () { - beforeEach('Loading Datasets', function () { - cy.visitLoadedPage(''); - - // Navigate to 'Data&Models' page - cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').click(); - - cy.waitForLoadingMask() - - }) - - segmentationDatasetIds.forEach((id) => { - - it(`Access dataset ${id}`, function () { - // Search for segmentation related dataset - cy.get('.el-input__wrapper > .el-input__inner').clear(); - cy.get('.search-text').click(); - cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 10) - - cy.get('.el-input__wrapper > .el-input__inner').type(id); - cy.get('.search-text').click(); - - cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 1).first().as('dataset'); - - // Enter the dataset - cy.get('@dataset').find('.cell > :nth-child(1) > a').last().click(); - - // Enter the 'Gallery' tab - cy.get(':nth-child(5) > .style1', { timeout: 30000 }).click(); - cy.get('.gallery-container > .description-info > p > strong', { timeout: 30000 }).should('have.text', 'Data collection:'); - - // Check for segmentation - cy.findGalleryCard('Segmentation', 'prev'); - cy.get('.el-card > .el-card__body > :nth-child(1) > .details > :nth-child(1) > b').should('contain', 'Segmentation'); - cy.get('.el-card > .el-card__body > :nth-child(1) > .details > .el-button > span').should('contain', ' View Segmentation'); - }) - }) - }) - - describe('Should open scaffold through the gallery', { testIsolation: false }, function () { - beforeEach('Loading Anatomical Models', function () { - cy.visitLoadedPage(''); - - // Navigate to 'Data&Models' page - cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').click(); - - // Go to 'Anatomical Models' - cy.get(':nth-child(2) > .search-tabs__button').click(); - cy.get(':nth-child(2) > .search-tabs__button').should('have.class', 'active'); - - cy.waitForLoadingMask() - - }) - - scaffoldDatasetCategories.forEach((category) => { - - it(`Access scaffold ${category}`, function () { - // Search for scaffold related dataset - cy.get('.el-input__wrapper > .el-input__inner').clear(); - cy.get('.search-text').click(); - cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 10) - - cy.get('.el-input__wrapper > .el-input__inner').type(category); - cy.get('.search-text').click(); - - cy.get('.el-table__row', { timeout: 30000 }).first().as('dataset'); - - // Enter the dataset - cy.get('@dataset').find('.cell > :nth-child(1) > a', { timeout: 30000 }).last().click(); - - // Enter the 'Gallery' tab - cy.get(':nth-child(5) > .style1', { timeout: 30000 }).click(); - cy.get('.gallery-container > .description-info > p > strong', { timeout: 30000 }).should('have.text', 'Data collection:'); - - // Check for scaffold - cy.findGalleryCard('Scaffold', 'prev'); - cy.get('.el-card > .el-card__body > :nth-child(1) > .details > :nth-child(1) > b').contains('Scaffold').should('exist'); - cy.get('.el-card > .el-card__body > :nth-child(1) > .details > .el-button > span').contains('View Scaffold').should('exist').as('scaffold'); - - // cy.get('@scaffold').first().click() - // Alternative solution - cy.url().then(($url) => { - const datasetId = $url.substring($url.lastIndexOf("/") + 1, $url.indexOf("?")); - cy.get('.dataset-information-box > :nth-child(1)').then(($version) => { - cy.intercept('**/query?**').as('query'); - cy.intercept('**/dataset_info/**').as('dataset_info'); - cy.intercept('**/datasets/**').as('datasets'); - - const version = $version.text().match(/[0-9]+/); - cy.visit(`/maps?type=scaffold&dataset_id=${datasetId}&dataset_version=${version}`); - - cy.wait('@query', { timeout: 20000 }); - - // Search dataset id - cy.get('.search-input > .el-input__wrapper > .el-input__inner').clear(); - cy.get('.search-input > .el-input__wrapper > .el-input__inner').type(datasetId); - cy.get('.header > .el-button').click(); - - cy.wait(['@dataset_info', '@datasets'], { timeout: 20000 }); - - // Check for search result and the tag 'Scaffold' - cy.get('.dataset-card-container > .dataset-card:visible', { timeout: 30000 }).as('datasetCards'); - - cy.get('@datasetCards').filter(`:contains(${datasetId})`).within(() => { - cy.get('.badges-container > .container', { timeout: 30000 }).contains(/Scaffold/i).click(); - - cy.waitForLoadingMask() - - }); - - cy.get('@datasetCards').contains(/View Scaffold/i).click(); - - cy.waitForLoadingMask() - - // Check for context card - cy.get('.context-card').should('be.visible'); - cy.get('.context-image').should('have.attr', 'src').and('contain', datasetId); - cy.get('[style="margin-right: 8px;"] > .title').should('have.class', 'title'); - - cy.get('.open-tab > .el-icon').click(); - - cy.get('@datasetCards').contains(/All/i).click(); - - // cy.get('@datasetCards').contains(/View Dataset/i).click(); - // Alternative solution - cy.visitLoadedPage(`/datasets/${datasetId}?type=dataset`); - }) - }) - }) - }) - }) - - describe('Should find data by category', { testIsolation: false }, function () { - beforeEach('Visit homepage', function () { - cy.intercept('**/query?**').as('query'); - cy.visitLoadedPage(''); - }) - - categories.forEach((category) => { - - it(`Filter datasets by ${category}`, function () { - // Check for category exist - const regex = new RegExp(category, 'i') - cy.get('.data-wrap > .data-item > .mb-0.mt-8').contains(regex).should('exist').as('facetsCategory'); - cy.get('@facetsCategory').click(); - - cy.wait('@query', { timeout: 20000 }); - - cy.get('.cell > :nth-child(1) > .property-table > :nth-child(1) > :nth-child(2)', { timeout: 30000 }).first().contains(regex).should('exist'); - - // Check for detail page - cy.get('.el-table__row', { timeout: 30000 }).first().as('dataset'); - cy.get('@dataset').find('.cell > :nth-child(1) > a').last().click(); - cy.contains(regex).should('have.length.above', 0); - }) - }) - }) -}) \ No newline at end of file diff --git a/tests/cypress/e2e/userstories.js b/tests/cypress/e2e/userstories.js new file mode 100644 index 0000000..1e5f472 --- /dev/null +++ b/tests/cypress/e2e/userstories.js @@ -0,0 +1,170 @@ +/** + * In order to reduce the number of service requests and not affect Content QC. + * The following test cases are temporarily commented out in case they will be needed in the future. + */ + +// // To check the segmentation card +// // should use datasets which have segmentation data +// const segmentationDatasetIds = [226, 77] +// const scaffoldDatasetCategories = ['pig colon', 'pig heart'] +// const categories = ['stomach', 'lung'] + +// describe('User stories', function () { +// describe('Should find segmentation in the gallery', { testIsolation: false }, function () { +// beforeEach('Loading Datasets', function () { +// cy.visitLoadedPage(''); + +// // Navigate to 'Data&Models' page +// cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').click(); + +// cy.waitForLoadingMask() + +// }) + +// segmentationDatasetIds.forEach((id) => { + +// it(`Access dataset ${id}`, function () { +// // Search for segmentation related dataset +// cy.get('.el-input__wrapper > .el-input__inner').clear(); +// cy.get('.search-text').click(); +// cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 10) + +// cy.get('.el-input__wrapper > .el-input__inner').type(id); +// cy.get('.search-text').click(); + +// cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 1).first().as('dataset'); + +// // Enter the dataset +// cy.get('@dataset').find('.cell > :nth-child(1) > a').last().click(); + +// // Enter the 'Gallery' tab +// cy.get(':nth-child(5) > .style1', { timeout: 30000 }).click(); +// cy.get('.gallery-container > .description-info > p > strong', { timeout: 30000 }).should('have.text', 'Data collection:'); + +// // Check for segmentation +// cy.findGalleryCard('Segmentation', 'prev'); +// cy.get('.el-card > .el-card__body > :nth-child(1) > .details > :nth-child(1) > b').should('contain', 'Segmentation'); +// cy.get('.el-card > .el-card__body > :nth-child(1) > .details > .el-button > span').should('contain', ' View Segmentation'); +// }) +// }) +// }) + +// describe('Should open scaffold through the gallery', { testIsolation: false }, function () { +// beforeEach('Loading Anatomical Models', function () { +// cy.visitLoadedPage(''); + +// // Navigate to 'Data&Models' page +// cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').click(); + +// // Go to 'Anatomical Models' +// cy.get(':nth-child(2) > .search-tabs__button').click(); +// cy.get(':nth-child(2) > .search-tabs__button').should('have.class', 'active'); + +// cy.waitForLoadingMask() + +// }) + +// scaffoldDatasetCategories.forEach((category) => { + +// it(`Access scaffold ${category}`, function () { +// // Search for scaffold related dataset +// cy.get('.el-input__wrapper > .el-input__inner').clear(); +// cy.get('.search-text').click(); +// cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 10) + +// cy.get('.el-input__wrapper > .el-input__inner').type(category); +// cy.get('.search-text').click(); + +// cy.get('.el-table__row', { timeout: 30000 }).first().as('dataset'); + +// // Enter the dataset +// cy.get('@dataset').find('.cell > :nth-child(1) > a', { timeout: 30000 }).last().click(); + +// // Enter the 'Gallery' tab +// cy.get(':nth-child(5) > .style1', { timeout: 30000 }).click(); +// cy.get('.gallery-container > .description-info > p > strong', { timeout: 30000 }).should('have.text', 'Data collection:'); + +// // Check for scaffold +// cy.findGalleryCard('Scaffold', 'prev'); +// cy.get('.el-card > .el-card__body > :nth-child(1) > .details > :nth-child(1) > b').contains('Scaffold').should('exist'); +// cy.get('.el-card > .el-card__body > :nth-child(1) > .details > .el-button > span').contains('View Scaffold').should('exist').as('scaffold'); + +// // cy.get('@scaffold').first().click() +// // Alternative solution +// cy.url().then(($url) => { +// const datasetId = $url.substring($url.lastIndexOf("/") + 1, $url.indexOf("?")); +// cy.get('.dataset-information-box > :nth-child(1)').then(($version) => { +// cy.intercept('**/query?**').as('query'); +// cy.intercept('**/dataset_info/**').as('dataset_info'); +// cy.intercept('**/datasets/**').as('datasets'); + +// const version = $version.text().match(/[0-9]+/); +// cy.visit(`/maps?type=scaffold&dataset_id=${datasetId}&dataset_version=${version}`); + +// cy.wait('@query', { timeout: 20000 }); + +// // Search dataset id +// cy.get('.search-input > .el-input__wrapper > .el-input__inner').clear(); +// cy.get('.search-input > .el-input__wrapper > .el-input__inner').type(datasetId); +// cy.get('.header > .el-button').click(); + +// cy.wait(['@dataset_info', '@datasets'], { timeout: 20000 }); + +// // Check for search result and the tag 'Scaffold' +// cy.get('.dataset-card-container > .dataset-card:visible', { timeout: 30000 }).as('datasetCards'); + +// cy.get('@datasetCards').filter(`:contains(${datasetId})`).within(() => { +// cy.get('.badges-container > .container', { timeout: 30000 }).contains(/Scaffold/i).click(); + +// cy.waitForLoadingMask() + +// }); + +// cy.get('@datasetCards').contains(/View Scaffold/i).click(); + +// cy.waitForLoadingMask() + +// // Check for context card +// cy.get('.context-card').should('be.visible'); +// cy.get('.context-image').should('have.attr', 'src').and('contain', datasetId); +// cy.get('[style="margin-right: 8px;"] > .title').should('have.class', 'title'); + +// cy.get('.open-tab > .el-icon').click(); + +// cy.get('@datasetCards').contains(/All/i).click(); + +// // cy.get('@datasetCards').contains(/View Dataset/i).click(); +// // Alternative solution +// cy.visitLoadedPage(`/datasets/${datasetId}?type=dataset`); +// }) +// }) +// }) +// }) +// }) + +// describe('Should find data by category', { testIsolation: false }, function () { +// beforeEach('Visit homepage', function () { +// cy.intercept('**/query?**').as('query'); +// cy.visitLoadedPage(''); +// }) + +// categories.forEach((category) => { + +// it(`Filter datasets by ${category}`, function () { +// // Check for category exist +// const regex = new RegExp(category, 'i') +// cy.get('.data-wrap > .data-item > .mb-0.mt-8').contains(regex).should('exist').as('facetsCategory'); +// cy.get('@facetsCategory').click(); + +// cy.wait('@query', { timeout: 20000 }); + +// cy.get('.cell > :nth-child(1) > .property-table > :nth-child(1) > :nth-child(2)', { timeout: 30000 }).first().contains(regex).should('exist'); + +// // Check for detail page +// cy.get('.el-table__row', { timeout: 30000 }).first().as('dataset'); +// cy.get('@dataset').find('.cell > :nth-child(1) > a').last().click(); +// cy.contains(regex).should('have.length.above', 0); +// }) +// }) +// }) +// }) \ No newline at end of file diff --git a/tests/cypress/support/commands.js b/tests/cypress/support/commands.js index 77806e9..fdc2719 100644 --- a/tests/cypress/support/commands.js +++ b/tests/cypress/support/commands.js @@ -91,35 +91,22 @@ Cypress.Commands.add('findGalleryCard', (text, dir) => { clickNextPageButton() }) -Cypress.Commands.add('clickNeuron', (coordinate, pixel) => { +Cypress.Commands.add('clickOnNeuron', (coordinate, pixel) => { let coorX = coordinate.x let coorY = coordinate.y - const clickNeuron = () => { + const clickOnNeuron = () => { cy.get('@canvas').click(coorX, coorY) cy.wait(5000) cy.get('body').then(($body) => { - if ($body.find('.sidebar-container > .tab-container').length > 0) { - cy.get('.sidebar-container', { timeout: 30000 }).within(() => { - cy.get('.title-text').should('have.length', 2) - cy.get('.active-tab > .title-text-table > .title-text').should('contain', 'Connectivity') - - // Check for the provenance card content - cy.get('.title').should('exist') - cy.get('.subtitle').should('exist') - cy.get('.main > .content-container').should('exist') - cy.get('.main > .content-container > .block').should('have.length.above', 0) - }) - // Close the provenance card - cy.get('.close-tab').click({ force: true }) - } else { + if ($body.find('.sidebar-container > .tab-container').length === 0) { coorX -= pixel - clickNeuron() + clickOnNeuron() } }) } - clickNeuron() + clickOnNeuron() }) Cypress.Commands.add('filterCheckbox', (factArray, action, checkbox) => { diff --git a/tests/cypress/support/stringToArray.js b/tests/cypress/support/stringToArray.js new file mode 100644 index 0000000..606ffec --- /dev/null +++ b/tests/cypress/support/stringToArray.js @@ -0,0 +1,13 @@ +export const stringToArray = (stringToSplit, separator) => { + + const array = stringToSplit.split(separator); // split string by separator + + const trimmedArray = array.map((item) => item.trim()); // remove leading/trailing white spaces + + const validArray = trimmedArray.filter((item) => item); // remove empty strings + + const uniqueArray = [...new Set(validArray)]; // remove duplicates + + return uniqueArray; + +};