jest preview

Visualização de jest

Depure seus testes de brincadeira. Sem esforço. ?

Experimente a visualização do jest online. Não é necessário downloads!

Usando Vitest? Experimente a visualização Vitest

Por que uma visualização de brincadeira

Ao escrever testes usando o JEST, geralmente depuramos lendo o código HTML. Às vezes, o HTML é muito complicado para visualizar a interface do usuário em nossa cabeça. jest-preview visualiza seus testes de brincadeira em um navegador e você pode ver sua interface do usuário real visualmente, o que ajuda a escrever e depurar testes de brincadeira mais rapidamente.

jest-preview foi projetado inicialmente para funcionar com a biblioteca de brincadeiras e reagências. O pacote é de estrutura-estrutura e você pode usá-lo com qualquer estrutura de front-end e bibliotecas de teste. Para exemplos:

• Vite React
• Criar aplicativo React
• NextJs
• SVELTE
• Angular
• Vue

Características

• ? Visualize o HTML do seu aplicativo real em um navegador em milissegundos.
• Navegador de recarga automática ao executar preview. Debug () `.
• ? Apoie CSS:
  • ✅ Importação direta de CSS
  • ✅ Número de bibliotecas CSS-in-JS, como:
    • ✅ Componentes com estilo
    • ✅ Emoção
  • ✅ CSS global
  • ✅ Módulos CSS
  • ✅ Sass
• ? Suporte a visualização de imagens.

Como usar jest-preview em 2 linhas de código

 + import preview from 'jest-preview';

describe('App', () => {
  it('should work as expected', () => {
    render(<App />);
+    preview.debug();
  });
});

Ou:

 + import { debug } from 'jest-preview';

describe('App', () => {
  it('should work as expected', () => {
    render(<App />);
+    debug();
  });
});

Você também precisa iniciar o servidor de visualização do jest executando a jest-preview da CLI. Continue lendo o uso para obter as instruções de detalhes.

Opinião

Seu feedback é muito importante para nós. Por favor, ajude jest-preview a se tornar um software melhor enviando feedback aqui.

Instalação

Consulte o Guia de Instalação no site oficial da JEST Visuew.

Uso

Consulte o Guia de Uso no Site Oficial de Visualização do JEST.

Configurações avançadas

A visualização do jest vem com transformação pré-configurada. No entanto, em casos de uso mais avançados em que você possui transformação de código personalizada, consulte o Guia de transformação de código.

Próximos recursos

• Apoie mais bibliotecas css-in-js .
• Visualizações múltiplas.
• Você nomeia isso.

Apoiar

Por favor, arquive um problema ou adicione uma nova discussão se encontrar algum problema.

Você também pode mencionar @JestPreview ou @Hung_Dev no Twitter, se quiser ter mais algumas discussões ou sugestões.

Também temos um servidor Discord:

Contribuindo

Mal podemos esperar para ver suas contribuições. Veja o Guia de Contribuição em Contribuindo.md

Colaboradores

Obrigado a essas pessoas maravilhosas (key emoji):

Viet Nguyen pendurado	Truong Nguyen	Viet Huu Doan ?	Harveynguyen ️	Matt Murphy	Traitanit huangsri	Filho de Thanh Nguyen
Minh Nguyen	Kyle (Tình Vũ) ?	Makoto Tateno	Abhishek Rawat	Huynh Duc Duy	Nuno Casteleira ?	SundayCrafts
Lunduocai ?	Huyenuet ️	Barragens de Bennett	Steven Rosato ?	NHDUCIT ?	Benoit Grasset ?	Sergii Kirianov ?
Kim, Harim	Lars Gyrup Brink Nielsen	Mike Shi	Veniamin Krol	Ikko Ashimine	Pavel fechado ?	David Z Hao ?
Rohitbels	Rivaldi Putra	Zhao longo	Justin Sun. ?

Este projeto segue a especificação de todos os contribuintes. As contribuições de qualquer tipo são bem -vindas!

História da estrela

Licença

Mit

Patrocinadores

Seu apoio financeiro ajuda o projeto vivo e em modo de desenvolvimento. Ter um impacto patrocinando US $ 1 via Open Collective.

• Patrocinador de bronze ?:
  • A imagem do logotipo/ perfil da sua empresa no ReadMe.md e www.jest-preview.com
• Patrocinador de prata?:
  • Tudo isso acima
  • Seus pedidos serão priorizados.
• Patrocinador de ouro?:
  • Tudo isso acima
  • Vamos discutir seus benefícios para este nível, entre em contato com o autor
• Patrocinador de diamantes?:
  • Tudo isso acima
  • Vamos discutir seus benefícios para este nível, entre em contato com o autor

Patrocinadores de bronze?

Patrocinadores anteriores