arshmakker

//functional testing
it('Renders the correct results after the search keyword is entered', () => {
    render(<Header InitialData={SampleData}/>)
    fireEvent.change(screen.getByTestId("searchText"),
        { target: { value: "2nd" } })
    expect(screen.getByTestId("searchText").value).toBe("2nd")
    fireEvent.click(screen.getByRole('button'))
    expect(screen.getAllByText(/2nd/i).length).toBe(2)
    expect(screen.getAllByText(/1st/i).length).toBe(1)
});

arshmakker

import React from 'react'
import Header from '../components/Header'
import renderer from 'react-test-renderer'
import { render, fireEvent, screen } from '@testing-library/react'

const classHeader = "sample class"
const SampleData = new Set(["1st Sample",
    "2nd Sample",
    "3rd Sample"])

arshmakker

import React, { useState } from 'react'
import Search from './Search'
import LogoBar from './LogoBar'
import InitialList from './InitialList'
import ResultsList from './ResultsList'


function Header({ InitialData = new Set(["1st Option",
    "2nd Option",
    "3rd Option"]) }) {

arshmakker

import React from 'react'

function Button() {    
    return (
        <button>Press Me</button>
    )
}

export default Button;

arshmakker

import React from 'react'
import Button from '../components/Button'
import renderer from 'react-test-renderer'

const classButton = "sampleClass"
const title = "Sample Title"


it("Renders the Button correctly with no props ", () => {
    const tree = renderer

arshmakker

import React from 'react';
import Button from './Button';

const defaultProps = {
  classSearch: "",
  title="Search",
  searchPlaceholder:"Type here to search"
}
function Search(props =defaultProps) {

arshmakker

import React from 'react'

function Button({
    classButton= "",
    title= "Press Me",

}) {    
    return (
        <button className={classButton}>{title}</button>
    )