From 87906ca6ccafc523a3cfcd85debb4cdf7af2bdcf Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 15:16:49 -0500 Subject: [PATCH 01/20] Add tests --- cypress/e2e/spec.cy.js | 76 ++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 74 insertions(+), 2 deletions(-) diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index 322992c..470e842 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -1,5 +1,77 @@ describe('template spec', () => { it('passes', () => { - cy.visit('https://example.cypress.io') + cy.visit('http://localhost:3000/') }) -}) \ No newline at end of file +}) + +describe('API Tests', () => { + it('Fetches and displays Wikipedia page contents', () => { + cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?').as('fetchContents'); + cy.visit('/'); + cy.wait('@fetchContents').then(({ response }) => { + expect(response.statusCode).to.equal(200); + }); + cy.contains('Loading...').should('not.exist'); + cy.contains('An error occurred').should('not.exist'); + }); + + it('Handles error when API fails', () => { + cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?', { + statusCode: 500, + body: 'Server Error', + delayMs: 200, + }).as('fetchError'); + cy.visit('/'); + cy.wait('@fetchError').then(({ response }) => { + expect(response.statusCode).to.equal(500); + cy.contains('An error occurred').should('exist'); + }); + }); +}); + +describe('App Component', () => { + it('Loads the app properly', () => { + cy.visit('/'); + cy.get('.header-text').should('be.visible'); + cy.get('.login-button').should('be.visible'); + }); + + it('Displays footer controversies', () => { + cy.visit('/'); + cy.get('.footer-card').should('be.visible'); + cy.get('.footer-text').should('contain', 'Random Controversy'); + }); +}); + +describe('Can search for a Controversy', () => { + it('Searches for a term', () => { + cy.visit('/'); + cy.get('input[type="text"]').type('SearchTerm{enter}'); + }); + + it('Displays controversies for a search result', () => { + cy.visit('/'); + }); +}); + +describe('Card Component', () => { + it('Renders snippet properly', () => { + cy.visit('/'); + cy.get('.card-content').should('be.visible'); + }); + + it('Handles show more/show less functionality', () => { + cy.visit('/'); + }); +}); + +describe('WikipediaPage Component', () => { + it('Loads page content properly', () => { + cy.visit('/article/PageTitle'); + cy.get('.article').should('be.visible'); + }); + + it('Saves controversy properly', () => { + cy.visit('/'); + }); +}); \ No newline at end of file From 8419399c1fe7775dede1c4b24a3f957680f8d844 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 15:17:11 -0500 Subject: [PATCH 02/20] add error boundary --- src/App/App.js | 61 ++++++++++++++++++++++++++------------------------ 1 file changed, 32 insertions(+), 29 deletions(-) diff --git a/src/App/App.js b/src/App/App.js index 3a17a6d..48d4bfe 100644 --- a/src/App/App.js +++ b/src/App/App.js @@ -7,6 +7,7 @@ import './App.css'; import Card from '../Card/Card.js'; import useSearchResults from '../hooks/useSearchResults.js'; import Profile from '../UserView/UserView.js'; +import ErrorBoundary from '../Errors/ErrorBoundary.js'; function App() { const { isLoading, isAuthenticated } = useAuth0(); @@ -48,37 +49,39 @@ function App() { } return ( -
-
- -

H8rAid!

- - - {isAuthenticated && } -
- - }/> - } /> - }/> - } /> - - {showRandomControversy && ( + +
+
+ +

H8rAid!

+ + + {isAuthenticated && } +
+ + }/> + } /> + }/> + } /> + + {showRandomControversy && ( -
-

Random Controversy

- {controversies[0] &&

{initialResults.title}

} -
- {controversies.map((item, i) => ( - - ))} +
+

Random Controversy

+ {controversies[0] &&

{initialResults.title}

} +
+ {controversies.map((item, i) => ( + + ))} +
-
- )} -
+ )} +
+ ); }; From d6fc28f69b080b84053e986571270daa2b09deaf Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 15:17:28 -0500 Subject: [PATCH 03/20] Add proptypes --- src/Card/Card.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/Card/Card.js b/src/Card/Card.js index 49a04ae..fabc08f 100644 --- a/src/Card/Card.js +++ b/src/Card/Card.js @@ -23,4 +23,8 @@ const Card = ({ snippet, onSave, onSaveAsFavorite }) => { ); }; -export default Card; \ No newline at end of file +export default Card; + +Card.propTypes = { + snippet: PropTypes.string.isRequired, +}; \ No newline at end of file From 775e5afbd3d55226cb886aabd0c9747f536fda9c Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 15:18:35 -0500 Subject: [PATCH 04/20] Add error handling --- src/Errors/Errors.js | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 src/Errors/Errors.js diff --git a/src/Errors/Errors.js b/src/Errors/Errors.js new file mode 100644 index 0000000..84fde61 --- /dev/null +++ b/src/Errors/Errors.js @@ -0,0 +1,12 @@ +import React from 'react'; + +const errorMessage = ({ errorMessage }) => { + return ( +
+

Error Encountered

+

{errorMessage}

+
+ ); +}; + +export default errorMessage; \ No newline at end of file From 9ff1b4a5e1d78d560daded7de7fd1bbbe58c4d88 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 15:18:50 -0500 Subject: [PATCH 05/20] Dynamic errors --- src/Errors/ErrorBoundary.js | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) create mode 100644 src/Errors/ErrorBoundary.js diff --git a/src/Errors/ErrorBoundary.js b/src/Errors/ErrorBoundary.js new file mode 100644 index 0000000..b26c6dd --- /dev/null +++ b/src/Errors/ErrorBoundary.js @@ -0,0 +1,32 @@ +import ErrorPage from '../Errors/Errors.js'; +import React, { Component } from 'react'; + +class ErrorBoundary extends Component { + constructor(error) { + super(error); + this.state = { + hasError: false, + errorMessage: '', + }; + } + + static getDerivedStateFromError(error) { + if (error.message === 'Network response was not ok') { + return { hasError: true, errorMessage: 'Error in SpecificComponent' }; + } + if(error.message === 'Error fetching Wikipedia page:') { + return{ hasError: true, errorMessage: 'Cannot fetch Wikipedia page'} + } + return { hasError: true, errorMessage: error.toString() }; + } + + componentsDidCatch(error, errorInfo) { + console.error('ErrorBoundary caught an error:', error, errorInfo); + } + + render() { + return this.state.hasError ? : this.props.children; + } +} + +export default ErrorBoundary; \ No newline at end of file From bfc2a75f29fef0b1cd3a398c0f2bb5388992fc66 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 15:19:11 -0500 Subject: [PATCH 06/20] Proptypes --- src/UserView/UserView.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/UserView/UserView.js b/src/UserView/UserView.js index 20045c9..7e78579 100644 --- a/src/UserView/UserView.js +++ b/src/UserView/UserView.js @@ -40,4 +40,9 @@ const Profile = ({ savedControversies }) => { ); }; -export default Profile; \ No newline at end of file +export default Profile; + +ControversyDisplay.propTypes = { + initialResults: PropTypes.object.isRequired, + controversies: PropTypes.array.isRequired, +}; \ No newline at end of file From 0b6e2320fbeedb6f253b8a5cd44de1e724dadcb2 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 15:19:26 -0500 Subject: [PATCH 07/20] add proptypes --- src/WikipediaPage/WikipediaPage.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/WikipediaPage/WikipediaPage.js b/src/WikipediaPage/WikipediaPage.js index 65d4164..21b4c93 100644 --- a/src/WikipediaPage/WikipediaPage.js +++ b/src/WikipediaPage/WikipediaPage.js @@ -52,4 +52,8 @@ return ( ); }; -export default WikipediaPage; \ No newline at end of file +export default WikipediaPage; + +WikipediaPage.propTypes = { + pageTitle: PropTypes.string.isRequired, + }; \ No newline at end of file From 345e4da592a5d94ed62de67871e6b608a52e52a6 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 16:10:04 -0500 Subject: [PATCH 08/20] Tests --- cypress/e2e/spec.cy.js | 31 +++++++++++++++++++------------ 1 file changed, 19 insertions(+), 12 deletions(-) diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index 470e842..6eef455 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -4,24 +4,31 @@ describe('template spec', () => { }) }) +//Need to login before testing describe('API Tests', () => { it('Fetches and displays Wikipedia page contents', () => { - cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?').as('fetchContents'); - cy.visit('/'); + cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?', { + statusCode: 200, + fixture: 'wikipediaApiResponse.json' + + }).as('fetchContents'); + cy.visit('http://localhost:3000/'); cy.wait('@fetchContents').then(({ response }) => { expect(response.statusCode).to.equal(200); }); + cy.contains('Loading...').should('not.exist'); - cy.contains('An error occurred').should('not.exist'); + cy.contains('An error occurred').should('not.exist'); }); + it('Handles error when API fails', () => { cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?', { statusCode: 500, body: 'Server Error', delayMs: 200, }).as('fetchError'); - cy.visit('/'); + cy.visit('http://localhost:3000/'); cy.wait('@fetchError').then(({ response }) => { expect(response.statusCode).to.equal(500); cy.contains('An error occurred').should('exist'); @@ -31,13 +38,13 @@ describe('API Tests', () => { describe('App Component', () => { it('Loads the app properly', () => { - cy.visit('/'); + cy.visit('http://localhost:3000/'); cy.get('.header-text').should('be.visible'); cy.get('.login-button').should('be.visible'); }); it('Displays footer controversies', () => { - cy.visit('/'); + cy.visit('http://localhost:3000/'); cy.get('.footer-card').should('be.visible'); cy.get('.footer-text').should('contain', 'Random Controversy'); }); @@ -45,33 +52,33 @@ describe('App Component', () => { describe('Can search for a Controversy', () => { it('Searches for a term', () => { - cy.visit('/'); + cy.visit('http://localhost:3000/'); cy.get('input[type="text"]').type('SearchTerm{enter}'); }); it('Displays controversies for a search result', () => { - cy.visit('/'); + cy.visit('http://localhost:3000/'); }); }); describe('Card Component', () => { it('Renders snippet properly', () => { - cy.visit('/'); + cy.visit('http://localhost:3000/'); cy.get('.card-content').should('be.visible'); }); it('Handles show more/show less functionality', () => { - cy.visit('/'); + cy.visit('http://localhost:3000/'); }); }); describe('WikipediaPage Component', () => { it('Loads page content properly', () => { - cy.visit('/article/PageTitle'); + cy.visit('http://localhost:3000/Profile'); cy.get('.article').should('be.visible'); }); it('Saves controversy properly', () => { - cy.visit('/'); + cy.visit('http://localhost:3000/'); }); }); \ No newline at end of file From a3d0f2c7da8be386acd08009737b817abc31e797 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 16:11:12 -0500 Subject: [PATCH 09/20] add fixture --- cypress/fixtures/wikipediaApiResponse.json | 14 ++++++++++++++ 1 file changed, 14 insertions(+) create mode 100644 cypress/fixtures/wikipediaApiResponse.json diff --git a/cypress/fixtures/wikipediaApiResponse.json b/cypress/fixtures/wikipediaApiResponse.json new file mode 100644 index 0000000..f717e08 --- /dev/null +++ b/cypress/fixtures/wikipediaApiResponse.json @@ -0,0 +1,14 @@ +{ + "query": { + "search": [ + { + "title": "Example Title 1", + "snippet": "This is an example snippet for the first result." + }, + { + "title": "Example Title 2", + "snippet": "Another example snippet for the second result." + } + ] + } + } \ No newline at end of file From eb68024fe728f1dd1575072ae372e25fa2969ab4 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 16:11:53 -0500 Subject: [PATCH 10/20] comment out random --- src/App/App.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/App/App.js b/src/App/App.js index 48d4bfe..dcea118 100644 --- a/src/App/App.js +++ b/src/App/App.js @@ -36,9 +36,9 @@ function App() { }; // COMMENT BACK IN L8R - useEffect(() => { - randomSearch(); - }, []); + // useEffect(() => { + // randomSearch(); + // }, []); if (isLoading) { return ( From e3db183537d723e31a5c9497709005f551d5ae64 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 16:12:10 -0500 Subject: [PATCH 11/20] props --- src/Card/Card.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/Card/Card.js b/src/Card/Card.js index fabc08f..2d7d6c5 100644 --- a/src/Card/Card.js +++ b/src/Card/Card.js @@ -2,6 +2,7 @@ import React, { useState } from 'react'; import DOMPurify from 'dompurify'; import './Card.css'; import modifyRelativeUrls from '../hooks/modifyRelativeUrls'; +import PropTypes from "prop-types"; const Card = ({ snippet, onSave, onSaveAsFavorite }) => { const [showFullContent, setShowFullContent] = useState(false); From ed35ad0ed5e025df191e25d882de13a1425b0287 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 16:12:38 -0500 Subject: [PATCH 12/20] rework profile prop --- src/UserView/UserView.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/UserView/UserView.js b/src/UserView/UserView.js index 7e78579..26da1a3 100644 --- a/src/UserView/UserView.js +++ b/src/UserView/UserView.js @@ -1,5 +1,6 @@ import React, { useState } from 'react'; import Card from '../Card/Card'; +import PropTypes from "prop-types"; const Profile = ({ savedControversies }) => { const [showFavorites, setShowFavorites] = useState(false); @@ -42,7 +43,6 @@ const Profile = ({ savedControversies }) => { export default Profile; -ControversyDisplay.propTypes = { - initialResults: PropTypes.object.isRequired, - controversies: PropTypes.array.isRequired, -}; \ No newline at end of file +Profile.propTypes = { + savedControversies: PropTypes.array.isRequired, +} \ No newline at end of file From 16f23a4fff80d7c1e6be0b996646d18d35612973 Mon Sep 17 00:00:00 2001 From: Joseph Stewart Date: Sat, 6 Jan 2024 16:12:59 -0500 Subject: [PATCH 13/20] Wiki prop rework for functionality --- src/WikipediaPage/WikipediaPage.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/WikipediaPage/WikipediaPage.js b/src/WikipediaPage/WikipediaPage.js index 21b4c93..77a52d5 100644 --- a/src/WikipediaPage/WikipediaPage.js +++ b/src/WikipediaPage/WikipediaPage.js @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; import "./WikipediaPage.css" +import PropTypes from "prop-types"; const WikipediaPage = ({ pageTitle }) => { const [contents, setContents] = useState([]); From a133e94130ab4781ac54de7c217f4ec39916e8c8 Mon Sep 17 00:00:00 2001 From: Arden Ranta Date: Sat, 6 Jan 2024 14:45:11 -0800 Subject: [PATCH 14/20] adjust formatting and merge conflict line --- cypress/e2e/spec.cy.js | 1 - src/App/App.js | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index 6eef455..b8c60db 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -21,7 +21,6 @@ describe('API Tests', () => { cy.contains('An error occurred').should('not.exist'); }); - it('Handles error when API fails', () => { cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?', { statusCode: 500, diff --git a/src/App/App.js b/src/App/App.js index acb109d..b8c02ee 100644 --- a/src/App/App.js +++ b/src/App/App.js @@ -63,7 +63,7 @@ function App() { {showRandomControversy && (

Random Controversy

- {controversies[0] &&

{initialResults.title}

} + {controversies[0] &&

{initialResults.title}

}
{controversies.map((item, i) => ( Date: Sat, 6 Jan 2024 14:46:05 -0800 Subject: [PATCH 15/20] adjust formatting and merge conflict line --- cypress/e2e/spec.cy.js | 3 +-- cypress/fixtures/wikipediaApiResponse.json | 26 +++++++++++----------- src/WikipediaPage/WikipediaPage.js | 0 3 files changed, 14 insertions(+), 15 deletions(-) delete mode 100644 src/WikipediaPage/WikipediaPage.js diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index b8c60db..21304fe 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -9,8 +9,7 @@ describe('API Tests', () => { it('Fetches and displays Wikipedia page contents', () => { cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?', { statusCode: 200, - fixture: 'wikipediaApiResponse.json' - + fixture: 'wikipediaApiResponse', }).as('fetchContents'); cy.visit('http://localhost:3000/'); cy.wait('@fetchContents').then(({ response }) => { diff --git a/cypress/fixtures/wikipediaApiResponse.json b/cypress/fixtures/wikipediaApiResponse.json index f717e08..7934c9f 100644 --- a/cypress/fixtures/wikipediaApiResponse.json +++ b/cypress/fixtures/wikipediaApiResponse.json @@ -1,14 +1,14 @@ { - "query": { - "search": [ - { - "title": "Example Title 1", - "snippet": "This is an example snippet for the first result." - }, - { - "title": "Example Title 2", - "snippet": "Another example snippet for the second result." - } - ] - } - } \ No newline at end of file + "query": { + "search": [ + { + "title": "Example Title 1", + "snippet": "This is an example snippet for the first result." + }, + { + "title": "Example Title 2", + "snippet": "Another example snippet for the second result." + } + ] + } +} \ No newline at end of file diff --git a/src/WikipediaPage/WikipediaPage.js b/src/WikipediaPage/WikipediaPage.js deleted file mode 100644 index e69de29..0000000 From 149c8a83d22045546ce354e8af65a956521e267d Mon Sep 17 00:00:00 2001 From: Arden Ranta Date: Sat, 6 Jan 2024 15:30:43 -0800 Subject: [PATCH 16/20] add beforeEach hook and part of a test --- cypress/e2e/spec.cy.js | 50 +++++++++++++++----------- cypress/fixtures/example.json | 5 --- cypress/fixtures/sampleRandomCard.json | 3 ++ 3 files changed, 33 insertions(+), 25 deletions(-) delete mode 100644 cypress/fixtures/example.json create mode 100644 cypress/fixtures/sampleRandomCard.json diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index 21304fe..4c8fd33 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -1,21 +1,16 @@ -describe('template spec', () => { - it('passes', () => { - cy.visit('http://localhost:3000/') - }) -}) - //Need to login before testing describe('API Tests', () => { + beforeEach(() => { + cy.visit('http://localhost:3000/'); + }) it('Fetches and displays Wikipedia page contents', () => { cy.intercept('GET', 'https://en.wikipedia.org/w/api.php?', { statusCode: 200, fixture: 'wikipediaApiResponse', }).as('fetchContents'); - cy.visit('http://localhost:3000/'); cy.wait('@fetchContents').then(({ response }) => { expect(response.statusCode).to.equal(200); }); - cy.contains('Loading...').should('not.exist'); cy.contains('An error occurred').should('not.exist'); }); @@ -25,8 +20,7 @@ describe('API Tests', () => { statusCode: 500, body: 'Server Error', delayMs: 200, - }).as('fetchError'); - cy.visit('http://localhost:3000/'); + }).as('fetchError'); cy.wait('@fetchError').then(({ response }) => { expect(response.statusCode).to.equal(500); cy.contains('An error occurred').should('exist'); @@ -35,48 +29,64 @@ describe('API Tests', () => { }); describe('App Component', () => { + beforeEach(() => { + cy.visit('http://localhost:3000/'); + }) + it('Loads the app properly', () => { - cy.visit('http://localhost:3000/'); cy.get('.header-text').should('be.visible'); cy.get('.login-button').should('be.visible'); + cy.get('.random-headline').should('be.visible'); }); - it('Displays footer controversies', () => { - cy.visit('http://localhost:3000/'); - cy.get('.footer-card').should('be.visible'); - cy.get('.footer-text').should('contain', 'Random Controversy'); + it('Displays random controversies', () => { + cy.get('.card').should('be.visible'); + cy.get('.result-name').should('contain', ''); + cy.get('.random-headline').should('contain', 'Random Controversy'); + cy.get('.'); }); }); describe('Can search for a Controversy', () => { - it('Searches for a term', () => { + beforeEach(() => { cy.visit('http://localhost:3000/'); + }) + + it('Searches for a term', () => { cy.get('input[type="text"]').type('SearchTerm{enter}'); }); it('Displays controversies for a search result', () => { - cy.visit('http://localhost:3000/'); + }); }); describe('Card Component', () => { - it('Renders snippet properly', () => { + beforeEach(() => { cy.visit('http://localhost:3000/'); + }) + + it('Renders snippet properly', () => { + cy.get('.card-content').should('be.visible'); }); it('Handles show more/show less functionality', () => { - cy.visit('http://localhost:3000/'); + }); }); describe('WikipediaPage Component', () => { + beforeEach(() => { + cy.visit('http://localhost:3000/'); + }) + it('Loads page content properly', () => { cy.visit('http://localhost:3000/Profile'); cy.get('.article').should('be.visible'); }); it('Saves controversy properly', () => { - cy.visit('http://localhost:3000/'); + }); }); \ No newline at end of file diff --git a/cypress/fixtures/example.json b/cypress/fixtures/example.json deleted file mode 100644 index 02e4254..0000000 --- a/cypress/fixtures/example.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "name": "Using fixtures to represent data", - "email": "hello@cypress.io", - "body": "Fixtures are a great way to mock data for responses to routes" -} diff --git a/cypress/fixtures/sampleRandomCard.json b/cypress/fixtures/sampleRandomCard.json new file mode 100644 index 0000000..1797133 --- /dev/null +++ b/cypress/fixtures/sampleRandomCard.json @@ -0,0 +1,3 @@ +{ + +} From 918229abe755b5f5f1f8cd9e7bd29b529e5efb17 Mon Sep 17 00:00:00 2001 From: Arden Ranta Date: Sat, 6 Jan 2024 15:48:06 -0800 Subject: [PATCH 17/20] test/adds assertions with placeholders for fixture data --- cypress/e2e/spec.cy.js | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index 4c8fd33..4a009f0 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -43,21 +43,29 @@ describe('App Component', () => { cy.get('.card').should('be.visible'); cy.get('.result-name').should('contain', ''); cy.get('.random-headline').should('contain', 'Random Controversy'); - cy.get('.'); + cy.get('h2').should('contain', ''); + cy.get('p').should('contain', ''); + }); }); describe('Can search for a Controversy', () => { beforeEach(() => { cy.visit('http://localhost:3000/'); + //placeholder for login flow }) - it('Searches for a term', () => { + it('Searches for a term, then clears input', () => { + cy.get('input[type="text"]').should('be.visible'); cy.get('input[type="text"]').type('SearchTerm{enter}'); + cy.get('input[type="text"]').should('have.text', ''); }); it('Displays controversies for a search result', () => { - + cy.get('.card').should('be.visible'); + cy.get('.result-name').should('contain', ''); + cy.get('h2').should('contain', ''); + cy.get('p').should('contain', ''); }); }); @@ -67,8 +75,9 @@ describe('Card Component', () => { }) it('Renders snippet properly', () => { - cy.get('.card-content').should('be.visible'); + cy.get('h2').should('contain', ''); + cy.get('p').should('contain', ''); }); it('Handles show more/show less functionality', () => { From fefbc0bf72aa13408d35a91d9564ba9581d3e4fc Mon Sep 17 00:00:00 2001 From: Arden Ranta Date: Sat, 6 Jan 2024 16:03:59 -0800 Subject: [PATCH 18/20] consolidate test structure --- cypress/e2e/spec.cy.js | 39 +++++++++++++++++----- cypress/fixtures/sampleRandomCard.json | 3 -- cypress/fixtures/sampleRandomCards.json | 3 ++ cypress/fixtures/wikipediaApiResponse.json | 4 +++ 4 files changed, 38 insertions(+), 11 deletions(-) delete mode 100644 cypress/fixtures/sampleRandomCard.json create mode 100644 cypress/fixtures/sampleRandomCards.json diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index 4a009f0..1a83fa6 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -40,12 +40,18 @@ describe('App Component', () => { }); it('Displays random controversies', () => { - cy.get('.card').should('be.visible'); cy.get('.result-name').should('contain', ''); cy.get('.random-headline').should('contain', 'Random Controversy'); - cy.get('h2').should('contain', ''); - cy.get('p').should('contain', ''); - + cy.get('.card').should('be.visible') + cy.get('.card') + .children() + .first() + .within(() => { + cy.contains('h2', ''); + cy.contains('p', ''); + cy.contains('button', '😡Save Controversy😡'); + cy.contains('button', '🤬Save as favorite controversy🤬'); + }); }); }); @@ -64,8 +70,24 @@ describe('Can search for a Controversy', () => { it('Displays controversies for a search result', () => { cy.get('.card').should('be.visible'); cy.get('.result-name').should('contain', ''); - cy.get('h2').should('contain', ''); - cy.get('p').should('contain', ''); + cy.get('.results-list') + .children() + .first() + .within(() => { + cy.contains('h2', ''); + cy.contains('p', ''); + cy.contains('button', '😡Save Controversy😡'); + cy.contains('button', '🤬Save as favorite controversy🤬'); + }); + cy.get('.results-list') + .children() + .last() + .within(() => { + cy.contains('h2', ''); + cy.contains('p', ''); + cy.contains('button', '😡Save Controversy😡'); + cy.contains('button', '🤬Save as favorite controversy🤬'); + }); }); }); @@ -85,14 +107,15 @@ describe('Card Component', () => { }); }); -describe('WikipediaPage Component', () => { +describe('UserView Component', () => { beforeEach(() => { cy.visit('http://localhost:3000/'); + //login flow placeholder }) it('Loads page content properly', () => { cy.visit('http://localhost:3000/Profile'); - cy.get('.article').should('be.visible'); + // cy.get('.article').should('be.visible'); }); it('Saves controversy properly', () => { diff --git a/cypress/fixtures/sampleRandomCard.json b/cypress/fixtures/sampleRandomCard.json deleted file mode 100644 index 1797133..0000000 --- a/cypress/fixtures/sampleRandomCard.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - -} diff --git a/cypress/fixtures/sampleRandomCards.json b/cypress/fixtures/sampleRandomCards.json new file mode 100644 index 0000000..d95fbe8 --- /dev/null +++ b/cypress/fixtures/sampleRandomCards.json @@ -0,0 +1,3 @@ +{ + "need": "one sample result with multiple wiki cards" +} diff --git a/cypress/fixtures/wikipediaApiResponse.json b/cypress/fixtures/wikipediaApiResponse.json index 7934c9f..6bb143f 100644 --- a/cypress/fixtures/wikipediaApiResponse.json +++ b/cypress/fixtures/wikipediaApiResponse.json @@ -8,6 +8,10 @@ { "title": "Example Title 2", "snippet": "Another example snippet for the second result." + }, + { + "title": "Example Title 3", + "snippet": "Another example snippet for the third result." } ] } From 7839de79fca67d85be54ebfaca18a0902d289711 Mon Sep 17 00:00:00 2001 From: Arden Ranta Date: Sat, 6 Jan 2024 17:17:54 -0800 Subject: [PATCH 19/20] refactor testing further --- cypress/e2e/spec.cy.js | 23 +++++++++++++---------- src/App/App.js | 2 +- 2 files changed, 14 insertions(+), 11 deletions(-) diff --git a/cypress/e2e/spec.cy.js b/cypress/e2e/spec.cy.js index 1a83fa6..f4f4858 100644 --- a/cypress/e2e/spec.cy.js +++ b/cypress/e2e/spec.cy.js @@ -42,7 +42,7 @@ describe('App Component', () => { it('Displays random controversies', () => { cy.get('.result-name').should('contain', ''); cy.get('.random-headline').should('contain', 'Random Controversy'); - cy.get('.card').should('be.visible') + cy.get('.card').should('be.visible'); cy.get('.card') .children() .first() @@ -59,7 +59,7 @@ describe('Can search for a Controversy', () => { beforeEach(() => { cy.visit('http://localhost:3000/'); //placeholder for login flow - }) + }); it('Searches for a term, then clears input', () => { cy.get('input[type="text"]').should('be.visible'); @@ -80,14 +80,14 @@ describe('Can search for a Controversy', () => { cy.contains('button', '🤬Save as favorite controversy🤬'); }); cy.get('.results-list') - .children() - .last() - .within(() => { - cy.contains('h2', ''); - cy.contains('p', ''); - cy.contains('button', '😡Save Controversy😡'); - cy.contains('button', '🤬Save as favorite controversy🤬'); - }); + .children() + .last() + .within(() => { + cy.contains('h2', ''); + cy.contains('p', ''); + cy.contains('button', '😡Save Controversy😡'); + cy.contains('button', '🤬Save as favorite controversy🤬'); + }); }); }); @@ -114,7 +114,10 @@ describe('UserView Component', () => { }) it('Loads page content properly', () => { + cy.get('#profile').should('be.visible'); + cy.get('#profile').click(); cy.visit('http://localhost:3000/Profile'); + cy.get('.filter-buttons').should('have.descendants', 'button'); // cy.get('.article').should('be.visible'); }); diff --git a/src/App/App.js b/src/App/App.js index b8c02ee..c0c6679 100644 --- a/src/App/App.js +++ b/src/App/App.js @@ -51,7 +51,7 @@ function App() {

H8rAid!

- {isAuthenticated && } + {isAuthenticated && } From 10e12d35ad57c5a53260416bd42fa056c9f9ed58 Mon Sep 17 00:00:00 2001 From: Alexandre Hastings Date: Sun, 7 Jan 2024 18:32:05 -0500 Subject: [PATCH 20/20] styling for userview --- src/Main/Main.css | 0 src/UserView/UserView.css | 17 +++++++++++++++++ src/UserView/UserView.js | 1 + 3 files changed, 18 insertions(+) delete mode 100644 src/Main/Main.css diff --git a/src/Main/Main.css b/src/Main/Main.css deleted file mode 100644 index e69de29..0000000 diff --git a/src/UserView/UserView.css b/src/UserView/UserView.css index e69de29..5488cbf 100644 --- a/src/UserView/UserView.css +++ b/src/UserView/UserView.css @@ -0,0 +1,17 @@ +.profile { + flex-direction: column; + } + + .filter-buttons, .profile { + display: flex; + } + + .filter-buttons { + justify-content: center; + } + + @media screen and (max-width: 500px) { + .results-list { + flex-direction: column; + } + } \ No newline at end of file diff --git a/src/UserView/UserView.js b/src/UserView/UserView.js index 75fe454..c984943 100644 --- a/src/UserView/UserView.js +++ b/src/UserView/UserView.js @@ -1,6 +1,7 @@ import React, { useState } from 'react'; import Card from '../Card/Card'; import PropTypes from "prop-types"; +import './UserView.css'; const Profile = ({ savedControversies }) => { const [showFavorites, setShowFavorites] = useState(false);