Fala pessoal, estamos de volta para terminar os testes para verificar a inclusão do checkbox list no componente formulário. Vamos lá verificar a prop onChange. Vamos dar uma olhada na definição do onFruitChange para poder gente poder relembrar o que aconteceu. Se eu estar aqui, a definição do onFruitChange aqui no lado de baixo da tela, você vai pegar o event.target.value, esse cara vai ser o value que vai ser banana, maçã ou o nome da fruta. Aí a gente vai pegar a propriedade frutas do estado do componente, des.state.frutas, essa propriedade aqui tem os valores de true ou false para cada propriedade cujo nome é o nome da fruta. Aí o que a gente faz? A gente muda o valor, se for true vira o false, se for false vira o true, porque a gente está fazendo checkbox. A checkbox a gente marca ou desmarca, por isso que a gente só faz o operador aqui para inverter. Aí depois de tudo a gente dá o set.state com um novo valor da propriedade frutas. Nesse caso ele só vai mudar o de false para verdadeiro ou verdadeiro para false para verdadeiro. Se você não está aqui, vamos voltar para o estado inicial que a gente definiu para o componente. Se você lembra essa propriedade que frutas aqui cada é um objeto, cada propriedade é o nome do valor da checkbox. Nesse caso se a gente clicar no checkbox para banana, a gente vai ter o valor banana. Para você visualizar isso, vamos lá para o navegador aqui para você ver. Eu estou aqui rodando o aplicativo, a gente está vendo esse checkbox aqui. Eu vou abrir o console com o comando option J. Aí o console aqui do lado direito, quando eu clico por exemplo banana, a gente já tinha um console logo lá por isso que está aparecendo aqui. Você note que o banana agora virou true, se você se lembra. Então esse cara aqui, essa checkbox, a gente dá um inspecto para verificar. Nesse checkbox aqui tem valor banana. Para ver aqui. Por isso que ele pega esse valor, esse valor aqui é o nome da propriedade do objeto frutas. Por isso que a gente já fez no onChange. Aí a gente pega o valor, qualquer valor que tivesse, o false, o true e inverte com o operador de exclamação. Por isso que ele inverteu aqui. Se eu botar maçã, a última maçã agora é true. Desmarca maçã, maçã é false. Simples de andes. Então aquele onChange a gente vai testar se realmente está fazendo essa operação direita. Vamos voltar lá para o editor de texto. Certo? Vamos ver aqui. Em baixo. Esse cara aqui, né? Vamos lá para um frutas change. Então vamos lá, escreveu o teste. Opa, vou dar meu teclado de scoop. Deve incluir. Checkbox. Leva a prova. OnChange, né? Definida com uma função que acerta o estado do componente com os valores. Ah, difícil. Deve incluir um checkbox. Leva a prova. OnChange, defini com função que isso. Componente com os valores. Que tal assim? Isso provavelmente deve escrever melhor que eu nesse aspecto. Então vamos aqui. Agora a gente vai ver como vai fazer isso. Primeiro a gente vai ter que passar um evento. Esse evento tem que ter o target.value. A gente vai criar um objeto para poder imitar esse evento. A gente já tem o state.frutas que inicialmente é tudo false. Se a gente vai verificar, vamos escolher um valor, por exemplo, banana. E vamos ver se realmente o estado do componente aqui do wrapper foi, se for modificado. O novo estado for, tiver um valor daquela flag invertida. Então vamos lá. Você vai pegar e fazer um evento aqui false de imitando aqui. Esse evento tem uma propriedade target. Aqui tem o value. E você vai escolher qual que você quer. Tem banana, maçã e tem morango. Escolha um. Vou voltar morango, por exemplo. Com o evento dessa maneira, vamos chamar a onfrutaschange. Mas para poder fazer isso, a gente vai chamar diretamente da props do checkbox list. Então eu vou capturar o checkbox list. Vamos lá, find where. Esculpa. Node, node prop name. É frutas. Vou voltar no variável. Então vamos pegar o checkbox. Se eu pegar esse cara aqui, vai pegar essa definição da frutaschange. Dessa definição eu vou chamar a função com o evento que eu defini aqui. Entendeu? Se você não entender isso, você pode voltar esse cara no variável. Dessa maneira aqui. Estou reescrevendo para você entender melhor. Pega esse cara e captura a definição da função. Com essa definição, você chama a função com o evento falso que a gente emitou aqui. A gente criou. Definiu. Aí, o que a gente espera? Esperamos que a propriedade do morango lá, do estado componente, que seja agora true, porque inicialmente for falso. Component, find. Desculpa, component state. Frutas. Ponto que morango. Expect. Esse cara que seja o que? Ser be true. Se for inicialmente falso. A gente viu aqui que o estado iniciado do componente deve ser falso, mas se você quiser só, adicionar um setado aqui manualmente. Só para poder afirmar que realmente começou com o valor falso, você pode dar o component set props. Dessa maneira aqui. Frutas. Nesses casos que você vai ter que copiar o valor anterior, porque tem component state frutas com morango, seja falso. Só para afirmar que realmente foi falso. Ou se você quiser escrever todo objeto aqui, novamente, você pode também. Vamos fazer isso em vez de copiar as propriedades, na verdade. Deixa eu pegar aqui. Vamos tirar isso e deixar assim. Então, inicialmente, a gente afirma aqui que realmente o estado do componente começou anteriormente. Tinha a propriedade frutas com esse valor aqui que era tudo falso. A gente só se importa com esse na verdade para esse teste. Aí, depois de chamar um fruto a change, a gente espera que esse valor mude para o quê? Para morango que seja true. Por isso que a gente checa component state frutos morango to be true. Certo? Eu acho que está passando. Vamos ver, na implementação, fazer o teste falhar. Vai ver que eu, sei lá, essa parte que eu esqueci de botar a exclamação. Aí não vai verter. Vamos ver o que acontece. Então, esperava que o morango seja true, mas recebeu falso porque não mudou nada. E a gente esqueceu da implementação aqui do exclamação. Salva. Certo? Não deu tudo. OK. Aí, desse cara aqui, a gente só fez por um morango, né? Então, por morango, está funcionando. Você, se quiser, também aprimorar e fazer mais teste para esse cara, mais de um caso. Nesse caso, não é o caso que eu só fiz do morango. Você pode fazer para maçã e para banã. Então, vou deixar com um exercício que, se você quiser, aprimorar e fazer mais teste é opcional, certo? Então, o on change aqui está tudo OK. Olha essa maneira aqui que a gente fez. Primeiro, a gente criou um evento aqui. Com o target.value, que é aquele que a gente vai clicar. E passa para o onFruitChange, que a gente capturou. Mais primeira afirma que os próprios frutas estão todos falsos. Cada valor, cada propriedade. Aí, captura o checkbox e captura o onChange do checkbox, que na verdade é uma definição de uma função. O onFruitChange. A gente chama aquela função com o evento falso que a gente criou. Aí, depois, a gente espera que o estado, propriedade frutas.morang, que se torne true. Certo? Então, por isso, é só para verificar a inclusão do checkbox list. Então, a gente termina esse cara. Então, muito obrigado por assistir e até a próxima. Tchau. Tchau.