Commit 3e4f462a authored by DESKTOP-J7QTMBR\mikke's avatar DESKTOP-J7QTMBR\mikke
Browse files

Merge branch '6-lag-hensiktsmessige-tester' of...

Merge branch '6-lag-hensiktsmessige-tester' of https://gitlab.stud.idi.ntnu.no/it2810-h21/team-28/project-3
parents eeaf6c5d d2e4d09d
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}
describe('display', () => {
beforeEach(() => {
cy.visit('http://localhost:3001/');
})
it("Check if homepage is displayed correctly", () => {
cy.get('Button')
.should('contain', 'Name')
.should('be.visible')
.should('contain', 'Search')
.should('have.css','font-family')
.and('match', /serif/)
})
})
describe('When searching', () => {
beforeEach(() => {
cy.visit('http://localhost:3001/');
})
it("Find search field", () => {
cy.get(".searchbar > input")
.type("Norway")
.should("have.value", "Norway")
cy.get("#buttonclick").click();
cy.get('#card').first().should('include.text', 'Norway');
});
});
\ No newline at end of file
/// <reference types="cypress" />
// ***********************************************************
// This example plugins/index.js can be used to load plugins
//
// You can change the location of this file or turn off loading
// the plugins file with the 'pluginsFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/plugins-guide
// ***********************************************************
// This function is called when a project is opened or re-opened (e.g. due to
// the project's config changing)
/**
* @type {Cypress.PluginConfig}
*/
// eslint-disable-next-line no-unused-vars
module.exports = (on, config) => {
// `on` is used to hook into various events Cypress emits
// `config` is the resolved Cypress config
}
// ***********************************************
// This example commands.js shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add('login', (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
// ***********************************************************
// This example support/index.js is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************
// Import commands.js using ES2015 syntax:
import './commands'
// Alternatively you can use CommonJS syntax:
// require('./commands')
......@@ -14,6 +14,7 @@
"@types/react-dom": "^17.0.0",
"@types/react-redux": "^7.1.19",
"bootstrap": "5.1.1",
"cypress": "^8.7.0",
"react": "^17.0.2",
"react-bootstrap": "^2.0.0-rc.0",
"react-dom": "^17.0.2",
......@@ -26,7 +27,8 @@
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
"eject": "react-scripts eject",
"cypress:open": "cypress open"
},
"eslintConfig": {
"extends": [
......@@ -47,7 +49,6 @@
]
},
"devDependencies": {
"cypress": "^8.7.0",
"jest": "^27.3.1"
"cypress": "^8.7.0"
}
}
......@@ -17,7 +17,7 @@ export const CountryCard: FunctionComponent<IProps> = ({
const [active, setActive] = useState(store.getState().value===id);
store.subscribe(() => setActive(store.getState().value===id))
return <Card className={"CountryCard__card__"+active}
return <Card id= "card" className={"CountryCard__card__"+active}
onClick={() => {store.getState().value!==id ? store.dispatch({ type: 'setState', newValue: id }) : store.dispatch({ type: 'setState', newValue: -1 });}}
bg="dark">
<Card.Body>
......
......@@ -7,7 +7,7 @@ export const Header: React.FC = ({
}) => {
return (
<header>
<img src={globe} alt="Logo" className="Header__Logo"/>
<img src={globe} alt="Logo" id="Logo" className="Header__Logo"/>
<div className="Header__Content">{children}</div>
</header>
);
......
......@@ -14,10 +14,10 @@ exports[`FocusInput matches snapshot 1`] = `
>
<button
class="btn btn-outline-secondary"
id="search_button"
id="buttonclick"
type="button"
>
Search
Search
</button>
</div>
</div>
......
......@@ -14,7 +14,7 @@ import { searchbarStore } from "./SearchbarStore";
expect(container.firstChild).toMatchSnapshot();
});
describe('Component: Searchvar', () => {
describe('Component: Searchbar', () => {
const items =["Norway", "India", "Germany"];
describe("<searchbar />", () => {
......
......@@ -79,8 +79,8 @@ export class Searchbar extends React.Component<IProps, IState> {
<div className="searchbar">
<input type="text" className="form-control" placeholder="Enter Country" onInput={(e)=>{this.setState({search_text: e.currentTarget.value});this.setState({page_number: 0});}}/>
<div className="input-group-append">
<button id="search_button" onClick={() => this.onSearch()}
className="btn btn-outline-secondary" type="button"> Search</button>
<button onClick={() => this.onSearch()}
className="btn btn-outline-secondary" type="button" id="buttonclick">Search</button>
</div>
{this.state.active }
</div>
......
This diff is collapsed.
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment