Este app consiste em um seletor de cores que recebe um código RGBA informado pelo usuário através de controles deslizantes, como exemplificado pela galeria de fotos, e exibe a cor resultante. O componente ColorPanel
e seu fluxo de troca de cor de plano de fundo foram testados e os respectivos testes estão disponíveis nos diretórios component/
e e2e/
, respectivamente.
Este foi o terceiro repositório de código apresentado no Curso Superior de TSI do IFMS como requisito para obtenção da nota parcial das atividades da unidade curricular Construção de Páginas Web IV.
← Repositório anterior | Próximo repositório → |
---|
As seguintes tecnologias foram utilizadas para desenvolver este app:
Papel | Tecnologia |
---|---|
Ambiente de execução | Node |
Linguagem de programação | TypeScript |
Biblioteca de interface de usuário | React |
Empacotador de módulos | Vite |
Framework de teste | Cypress |
-
Clone o repositório de código em sua máquina;
-
Abra um shell de comando de sua preferência (prompt de comando, PowerShell, terminal etc.);
-
Instale as dependências do projeto através do seguinte comando:
$ npm install
Caso esteja utilizando o gerenciador de pacotes Yarn, execute o seguinte comando como alternativa:
$ yarn
- Execute o seguinte comando para iniciar o app:
Para npm:
$ npm run dev
Para Yarn:
$ yarn dev
- Execute o Cypress através do seguinte comando:
Para npm:
$ npm run cy:open
Para Yarn:
$ yarn cy:open
-
O comando acima abrirá uma janela do Cypress solicitando que selecione o tipo de teste: E2E (teste de ponta a ponta) e Component (teste de componente). Selecione a opção desejada;
-
Selecionada a opção desejada, será solicitado que selecione um navegador web para executar os testes. É recomendado selecionar o navegador Electron, pois o mesmo foi desenvolvido pelo time do framework Cypress e contém ferramentas integradas que podem colaborar com a escrita dos testes unitários;
-
Selecionado o navegador web, os testes unitários, seja de ponta a ponta ou de componente, serão apresentados por diretório para que você os selecione para que sejam executados.