No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Container test

7/15
Recursos

Aportes 2

Preguntas 0

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Mi solución al reto.

    it('Comprobar si tiene background azul',() => {
        // arrange

        const { getByRole } = render(
            <ContainerFlex role='banner' bgColor='blue' />
        )
        // act

        const ContainerFlexTest = getByRole('banner')
        // assert
        expect(ContainerFlexTest).toHaveStyle('background-color:blue;');
    })

bgcolor incorrecto

import { render } from "@testing-library/react";
import ContainerFlex from "./ContainerFlex";

describe('@components/ContainerFlex', ()=> {
    it('mensaje', ()=> {
        // arrange
        const { getByRole } = render(
            <ContainerFlex bgcolor={3} justifyContent="center" role="banner" />
        )
        
        // act 
        const ContainerFlexTest = getByRole('banner')

        // assert
        expect(ContainerFlexTest).toBeDefined();

    })
})


justifyContent incorrecto

import { render } from "@testing-library/react";
import ContainerFlex from "./ContainerFlex";

describe('@components/ContainerFlex', ()=> {
    it('mensaje', ()=> {
        // arrange
        const { getByRole } = render(
            <ContainerFlex bgcolor="red" justifyContent="red" role="banner" />
        )
        
        // act 
        const ContainerFlexTest = getByRole('banner')

        // assert
        expect(ContainerFlexTest).toBeDefined();

    })
})


bgcolor y justifyContent incorrecto

import { render } from "@testing-library/react";
import ContainerFlex from "./ContainerFlex";

describe('@components/ContainerFlex', ()=> {
    it('mensaje', ()=> {
        // arrange
        const { getByRole } = render(
            <ContainerFlex bgcolor={3} justifyContent="red" role="banner" />
        )
        
        // act 
        const ContainerFlexTest = getByRole('banner')

        // assert
        expect(ContainerFlexTest).toBeDefined();

    })
})


bgcolor y justifyContent correctos

import { render } from "@testing-library/react";
import ContainerFlex from "./ContainerFlex";

describe('@components/ContainerFlex', ()=> {
    it('mensaje', ()=> {
        // arrange
        const { getByRole } = render(
            <ContainerFlex bgcolor="red" justifyContent="center" role="banner" />
        )
        
        // act 
        const ContainerFlexTest = getByRole('banner')

        // assert
        expect(ContainerFlexTest).toBeDefined();

    })
})