(#12) Page Not Found for Disease

- enabled PageNotFound for 404 status - added prerender meta tag - added integration tests
NCIOCPL · Mar 18, 2021 · a16dc6f · a16dc6f
1 parent 971af09
commit a16dc6f
Show file tree

Hide file tree

Showing 7 changed files with 165 additions and 61 deletions.
diff --git a/.pa11yci b/.pa11yci
@@ -1,5 +1,7 @@
 {
   "urls": [
-    "http://localhost:3000"
+    "http://localhost:3000",
+    "http://localhost:3000/chicken-nugget?cfg=0",
+    "http://localhost:3000/c4872?cfg=0"
   ]
 }
diff --git a/cypress/integration/AppAnalytics/NoParamsPageNotFoundAnalytics.feature b/cypress/integration/AppAnalytics/NoParamsPageNotFoundAnalytics.feature
diff --git a/cypress/integration/AppAnalytics/PageNotFoundAnalytics.feature b/cypress/integration/AppAnalytics/PageNotFoundAnalytics.feature
@@ -0,0 +1,104 @@
+Feature: Analytics Page Not Found
+
+	Scenario: Page Load Analytics fires for a 404 on a disease dynamic listing page with no parameters
+		Given "trialListingPageType" is set to "Disease"
+		And "baseHost" is set to "http://localhost:3000"
+		And "canonicalHost" is set to "https://www.cancer.gov"
+		And "analyticsPublishedDate" is set to "02/02/2011"
+		And "siteName" is set to "National Cancer Institute"
+		When the user navigates to "/"
+		And page title on error page is "Page Not Found"
+		And browser waits
+		Then there should be an analytics event with the following details
+			| key                                         | value                             |
+			| type                                        | PageLoad                          |
+			| event                                       | TrialListingApp:Load:PageNotFound |
+			| page.name                                   | www.cancer.gov/                   |
+			| page.title                                  | Page Not Found                    |
+			| page.metaTitle                              | Page Not Found                    |
+			| page.language                               | english                           |
+			| page.type                                   | nciAppModulePage                  |
+			| page.channel                                | Clinical Trials                   |
+			| page.contentGroup                           | Clinical Trials: Custom           |
+			| page.publishedDate                          | 02/02/2011                        |
+			| page.additionalDetails.trialListingPageType | disease                           |
+
+	Scenario: Page Load Analytics fires for a 404 on a intervention dynamic listing page with no parameters
+		Given "trialListingPageType" is set to "Intervention"
+		And "baseHost" is set to "http://localhost:3000"
+		And "canonicalHost" is set to "https://www.cancer.gov"
+		And "analyticsPublishedDate" is set to "02/02/2011"
+		And "siteName" is set to "National Cancer Institute"
+		When the user navigates to "/"
+		And page title on error page is "Page Not Found"
+		And browser waits
+		Then there should be an analytics event with the following details
+			| key                                         | value                             |
+			| type                                        | PageLoad                          |
+			| event                                       | TrialListingApp:Load:PageNotFound |
+			| page.name                                   | www.cancer.gov/                   |
+			| page.title                                  | Page Not Found                    |
+			| page.metaTitle                              | Page Not Found                    |
+			| page.language                               | english                           |
+			| page.type                                   | nciAppModulePage                  |
+			| page.channel                                | Clinical Trials                   |
+			| page.contentGroup                           | Clinical Trials: Custom           |
+			| page.publishedDate                          | 02/02/2011                        |
+			| page.additionalDetails.trialListingPageType | intervention                      |
+
+	Scenario: Page Load Analytics fires for a 404 on a disease dynamic listing page with non-existent c-code
+		Given "trialListingPageType" is set to "Disease"
+		And "baseHost" is set to "http://localhost:3000"
+		And "canonicalHost" is set to "https://www.cancer.gov"
+		And "analyticsPublishedDate" is set to "02/02/2011"
+		And "siteName" is set to "National Cancer Institute"
+		When user navigates to non-existent page "/c123455?cfg=0"
+		And page title is "Page Not Found"
+		And browser waits
+		Then there should be an analytics event with the following details
+			| key                                         | value                             |
+			| type                                        | PageLoad                          |
+			| event                                       | TrialListingApp:Load:PageNotFound |
+			| page.name                                   | www.cancer.gov/c123455            |
+			| page.title                                  | Page Not Found                    |
+			| page.metaTitle                              | Page Not Found                    |
+			| page.language                               | english                           |
+			| page.type                                   | nciAppModulePage                  |
+			| page.channel                                | Clinical Trials                   |
+			| page.contentGroup                           | Clinical Trials: Custom           |
+			| page.publishedDate                          | 02/02/2011                        |
+			| page.additionalDetails.trialListingPageType | disease                           |
+
+	Scenario: Page Load Analytics fires for a 404 on a disease dynamic listing page with non-existent pretty-url
+		Given "trialListingPageType" is set to "Disease"
+		And "baseHost" is set to "http://localhost:3000"
+		And "canonicalHost" is set to "https://www.cancer.gov"
+		And "analyticsPublishedDate" is set to "02/02/2011"
+		And "siteName" is set to "National Cancer Institute"
+		When user navigates to non-existent page "/chicken-nugget?cfg=0"
+		And page title is "Page Not Found"
+		And browser waits
+		Then there should be an analytics event with the following details
+			| key                                         | value                             |
+			| type                                        | PageLoad                          |
+			| event                                       | TrialListingApp:Load:PageNotFound |
+			| page.name                                   | www.cancer.gov/chicken-nugget     |
+			| page.title                                  | Page Not Found                    |
+			| page.metaTitle                              | Page Not Found                    |
+			| page.language                               | english                           |
+			| page.type                                   | nciAppModulePage                  |
+			| page.channel                                | Clinical Trials                   |
+			| page.contentGroup                           | Clinical Trials: Custom           |
+			| page.publishedDate                          | 02/02/2011                        |
+			| page.additionalDetails.trialListingPageType | disease                           |
+
+
+
+
+
+
+
+
+
+
+
diff --git a/cypress/integration/PageNotFound.feature b/cypress/integration/PageNotFound.feature
@@ -0,0 +1,32 @@
+Feature: As a user when I visit a non existent trial listing page I am presented with page not found
+
+    Scenario: Disease 404: Page Not Found displays when a user views a dynamic listing page with invalid disease c-code
+        Given "trialListingPageType" is set to "Disease"
+        When user navigates to non-existent page "/c123455?cfg=0"
+        And page title is "Page Not Found"
+        And the text "We can't find the page you're looking for." appears on the page
+        And the following links and texts exist on the page
+            | https://www.cancer.gov         | homepage     |
+            | https://www.cancer.gov/types   | cancer type  |
+            | https://www.cancer.gov/contact | Get in touch |
+        And the search bar appears below
+        Then the title tag should be "Page Not Found"
+        And the page contains meta tags with the following names
+            | name                  | content |
+            | prerender-status-code | 404     |
+
+
+    Scenario: Disease 404: Page Not Found displays when a user views a dynamic listing page with invalid pretty url
+        Given "trialListingPageType" is set to "Disease"
+        When user navigates to non-existent page "/chicken-nuggets?cfg=0"
+        And page title is "Page Not Found"
+        And the text "We can't find the page you're looking for." appears on the page
+        And the following links and texts exist on the page
+            | https://www.cancer.gov         | homepage     |
+            | https://www.cancer.gov/types   | cancer type  |
+            | https://www.cancer.gov/contact | Get in touch |
+        And the search bar appears below
+        Then the title tag should be "Page Not Found"
+        And the page contains meta tags with the following names
+            | name                  | content |
+            | prerender-status-code | 404     |
diff --git a/cypress/integration/common/index.js b/cypress/integration/common/index.js
@@ -20,6 +20,15 @@ Then('page title on error page is {string}', (title) => {
 	cy.get('h1').should('contain', title);
 });
 
+Then('user navigates to non-existent page {string}', (path) => {
+	Cypress.on('uncaught:exception', (err, runnable) => {
+		// returning false here to Cypress from
+		// failing the test
+		return false;
+	});
+	cy.visit(path);
+});
+
 /*
     --------------------
         Page Visits
@@ -219,3 +228,14 @@ When('user clicks on {string} button', (arrow) => {
 When('pager is not displayed', () => {
 	cy.get('.pager__navigation li').should('not.exist');
 });
+
+
+/*
+    -----------------------
+       Page Not Found
+    -----------------------
+*/
+
+And('the text {string} appears on the page',(text)=>{
+cy.get('p').contains(text).should('exist')
+});
diff --git a/src/views/ErrorBoundary/ErrorBoundary.jsx b/src/views/ErrorBoundary/ErrorBoundary.jsx
@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 
 import ErrorPage from './ErrorPage';
+import PageNotFound from './PageNotFound';
 
 class ErrorBoundary extends Component {
 	constructor(props) {
@@ -23,8 +24,10 @@ class ErrorBoundary extends Component {
 	render() {
 		const { error, hasError } = this.state;
 
-		if (error && hasError) {
-			return <ErrorPage />;
+		if (hasError) {
+			const showPageNotFound =
+				typeof error === 'string' && error.indexOf('404') > -1;
+			return showPageNotFound ? <PageNotFound /> : <ErrorPage />;
 		}
 		return this.props.children;
 	}

diff --git a/src/views/ErrorBoundary/PageNotFound.jsx b/src/views/ErrorBoundary/PageNotFound.jsx
@@ -66,6 +66,7 @@ const PageNotFound = () => {
 				<title>{i18n.pageNotFoundTitle[language]}</title>
 				<meta property="dcterms.subject" content="Error Pages" />
 				<meta property="dcterms.type" content="errorpage" />
+				<meta name="prerender-status-code" content="404"/>
 			</Helmet>
 		);
 	};