React: Expresse mais testes via API pública

Posso dar uma olhada nisso no fim de semana e ver se consigo lidar com isso no curto prazo.

Ótimo, obrigado! Se você escolher algum teste em particular, por favor comente com o nome do arquivo no tópico para que outra pessoa não comece a trabalhar no mesmo teste.

Estou definitivamente muito interessado em contribuir para isso. Vou dar uma olhada neste fim de semana e encontrar uma oportunidade para refatorar!

Também tenho interesse 👍

Publiquei uma lista de testes no primeiro post. Apenas deixe-me saber quais você gostaria de tomar e eu vou atribuí-los a você.

ReactDOMInput-test está bom para mim :)

@SadPandaBear Você conseguiu!

Eu posso trabalhar em ReactErrorUtils-test . 😄

vou dar uma olhada em setInnerHTML-test.js

Eu vou fazer getEventCharCode-test.js . 😀

Eu posso trabalhar em getEventKey-test.js .

Eu posso levar escapeTextContentForBrowser-test.js .

Eu gostaria de dar uma chance a ChangeEventPlugin-test.js :)

Eu posso levar SyntheticEvent-test.js

Eu gostaria de trabalhar em EnterLeaveEventPlugin-test.js

Eu gostaria de trabalhar em ReactDOMEventListener-test.js

gostaria de receber BeforeInputEventPlugin-test.js

Eu gostaria de usar SyntheticKeyboardEvent-test.js. Obrigado 👍

Deixe-me levar inputValueTracking-test.js

Eu gostaria de trabalhar em SyntheticWheelEvent-test.js

Posso levar: ReactBrowserEventEmitter-test.js ?

Estou levando SelectEventPlugin-test.js

Eu gostaria de trabalhar em ReactDOMComponentTree-test.js

Eu gostaria de trabalhar em ReactTreeTraversal-test.js

Oi! 👋 Eu gostaria de trabalhar em ReactCoroutine-test.js

Eu posso levar SyntheticClipboardEvent-test.js

Eu gostaria de trabalhar em validateDOMNesting-test.js

Eu poderia levar EventPluginRegistry-test.js

Eu gostaria de experimentar ReactDOMComponent-test.js

Olá! Eu gostaria de experimentar quoteAttributeValueForBrowser-test.js ! :músculo:

Olá! Eu gostaria de experimentar ReactDOMServerIntegration-test.js !

vou levar ReactIncrementalPerf-test.js

Vou fazer getNodeForCharacterOffset-test.js

@burnsbeaver Qual é, FallbackCompisitionState-test ou getNodeForCharacterOffset-test ? Gostaríamos de começar com um teste por pessoa.

getNodeForCharacter por favor. Apaguei o outro comentário, desculpe a confusão!

Ainda temos FallbackCompositionState-test.js e ReactFiberHostContext-test.js grátis!

Vou pegar FallbackCompisitionState!

Eu posso tentar o ReactFiberHostContext-test.js

Atualização: todos os testes são feitos agora. Assine esta edição! Eles podem liberar no futuro se alguém não tiver tempo para terminar o trabalho. Comentaremos se algum teste estiver disponível para tentar novamente.

A todas as pessoas que fizeram os testes — obrigado! Quero reiterar que a solução nem sempre é clara e, em alguns casos, pode até não ser possível testar razoavelmente o comportamento sem algumas alterações na própria fonte do React. Se você se sentir preso, comente aqui e tentaremos descobrir um plano.

@adsonpleal Desculpe desapontá-lo - acabei de verificar e, infelizmente, acidentalmente já corrigimos ReactFiberHostContext-test . Eu não percebi isso no começo, mas esse TODO está desatualizado. Este é o único teste que posso ver que já está corrigido.

@gaearon Uau, refatorar ReactDOMInput-test vai me levar algum tempo, mas espero terminar tudo neste fim de semana.

Tenho uma pequena dúvida:
Tudo bem substituir todo esse comportamento da função setUntrackedValue que usa inputValueTracking para algo como ReactTestUtils.Simulate.? ?

A propósito, você pode verificar meu PR aqui para ver o que eu fiz para remover o inputValueTracking . Eu sei que alguns desses testes podem depender de coisas muito específicas de inputValueTracking , mas eu só queria saber se ReactTestUtils pode ser usado efetivamente.

Por inputValueTracking @jquense deve ter mais contexto sobre como fazer melhor. Mas contanto que você faça funcionar, podemos revisar e ver se a abordagem funciona ou não.

Apenas um aviso para qualquer outra pessoa, eu tinha uma versão mais antiga do yarn instalada (0.22) e estava tentando executar os testes localmente e tudo estava quebrando. A atualização do fio para o mais recente (1.2.1) corrigiu o problema e os testes estão funcionando bem agora.

@sadpandabear Eu tenho o mesmo módulo no meu arquivo de teste, então vou verificar sua implementação em breve

@gaearon Para os testes setInnerHTML , eles sentem que dependem da existência de setInnerHTML para que o conjunto de testes faça sentido.

Eu posso escrever alguns testes para substituir as funções existentes, mas o conjunto de testes é mais na linha de definir html interno, versus qualquer coisa específica para setInnerHTML . Acho que estou ficando um pouco preocupado com a nomenclatura do conjunto de testes.

EDIT: A menos que eu esteja enganado... SVGs tem uma propriedade innerHTML . Não tenho certeza se o segundo pedaço de testes neste arquivo é necessário.

@silvestrijonathan Acho que o que esses testes realmente estão tentando verificar é que dangerouslySetInnerHTML funciona como esperado no React. Portanto, se você modificar esses testes para usar o ReactDOM e renderizar o mesmo conteúdo com dangerouslySetInnerHTML , isso deve ser suficiente. Não há problema em renomear o teste para dangerouslySetInnerHTML-test se você achar que seria mais apropriado.

Depois de algumas horas brincando com meu arquivo de teste, tenho uma forte sugestão para novatos (como eu): inicie seus testes com um env (arquivo) limpo.
Eu estava editando o arquivo existente e ele zombou de algumas funções internas, então algumas funções ReactTestUtils foram quebradas!! Levei algum tempo para perceber por que as coisas não estavam funcionando como pretendido.

@gaearon Acho que precisamos esclarecer que ReactTestUtils , incluindo a simulação de eventos, deve ser considerada uma API privada. Isso atinge indiretamente as APIs internas, de modo que não nos permite testar adequadamente como funcionaria de outra forma. Por exemplo, isso dificultará nossa capacidade de testar pacotes compilados sem expor esses ganchos e não nos permitirá testar um novo sistema de eventos não sintético.

@dphurley , notei que você está trabalhando em ReactIncrementalPerf-test . Eu também estava trabalhando em uma suíte de testes que usa ReactCoroutine , então eu queria te avisar sobre este PR: #11338.
Não tenho certeza se você já enviou um PR, mas se não o fez, pode ser uma boa ideia baseá-lo em #11338 (se for aceito).

@gaearon Obrigado pelo seu conselho. Pensei em utilizar React-DOM com dangerouslySetInnerHTML para os testes, então vou fazer assim!

E sim, provavelmente vou renomear os testes para isso nesse caso. Procure meu PR no próximo dia ou assim.

Temos o primeiro PR fundido!

Dê uma olhada: https://github.com/facebook/react/pull/11309

Se você estiver trabalhando em algo relacionado a eventos, sugiro que leia as discussões em https://github.com/facebook/react/pull/11309 e as resenhas em:

https://github.com/facebook/react/pull/11316
https://github.com/facebook/react/pull/11317
https://github.com/facebook/react/pull/11327
https://github.com/facebook/react/pull/11332

Existem alguns temas comuns e pode ser valioso usar essas discussões para orientar outros PRs na direção certa.

Grandes convos para referência-obrigado!

O trabalho ficou um pouco ocupado, mas acho que poderei abrir um PR neste fim de semana para meus testes.

Eu ainda estou para olhar para o teste que eu peguei. Ocupado com outras coisas. Vou tentar levantar um PR em mais alguns dias, posso ganhar algum tempo?

Parece bom, com certeza!

eu tive mesmo problema

Mais um PR fundido! https://github.com/facebook/react/pull/11316

Mais dois para baixo. https://github.com/facebook/react/pull/11317 https://github.com/facebook/react/pull/11385

Escrevi uma pequena análise sobre como abordei um dos testes. https://github.com/facebook/react/pull/11385#issuecomment -341934588

até onde eu posso dizer que eles são todos levados, por favor poste aqui se algum liberar e eu vou assistir

Juntei mais dois PRs que lidam especificamente com SyntheticEvent s. Se você fez algum teste relacionado, confira e tente combinar em estilo e abordagem: https://github.com/facebook/react/pull/11365 e https://github.com/facebook/react/issues/ 11299

@gaearon Para EventPluginRegistry-test.js , como devemos reescrever o teste usando a API pública, vejo que estamos injetando plugins padrão em ReactDom.js -> ReactDOMClientInjection.js
{
SimpleEventPlugin,
EnterLeaveEventPlugin,
ChangeEventPlugin,
SelectEventPlugin,
BeforeInputEventPlugin,
}

Então, como exatamente poderíamos injetar nosso plug-in de simulação de teste e testar a funcionalidade EventPluginRegistry
Eu procurei por qualquer plugin personalizado e encontrei react-tap-event-plugin para verificar como exatamente os plugins personalizados são injetados.
Esta é a única maneira de injetar plugins

require('react-dom').__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.EventPluginHub.injection.injectEventPluginsByName({ 'TapEventPlugin': require('./TapEventPlugin.js')(shouldRejectClick) });

Temo que estou muito acima da minha cabeça em ReactTreeTraversal-test.js
Se alguém quiser dar uma chance, sinta-se à vontade para fazê-lo.

@aqumus

EventPluginRegistry é complicado. Eu acho que o primeiro passo seria descobrir onde ele está realmente sendo usado. Você está certo de que o plug-in de evento de toque é o único que ainda nos comprometemos a oferecer suporte. Convenientemente, temos isso no repositório. Então, talvez possamos adicionar um teste que funcione especificamente?

Também é provável que RN use EventPluginRegistry . Temos algum teste para verificar o funcionamento dos eventos RN? Não sei. Vale a pena comentar diferentes partes de EventPluginRegistry e verificar se algum teste falha. Podemos remover seus testes de API privada se o mesmo código já estiver coberto por outros testes que estressam esses caminhos de código. Isso faz sentido?

@gdevincenzi Parece bom, vou remover a atribuição.

Além disso, estarei ausente esta semana, mas, por favor, não deixe que isso o impeça de continuar com isso. Espero conseguir mais alguns PRs enviados mesclados na próxima semana.

eu posso pegar ReactTreeTraversal-test.js - é uma API desconhecida, mas parece um bom opp para aprender. conselho bem vindo @gdevincenzi

Parabéns a @gordyd por terminar um bastante complexo: https://github.com/facebook/react/pull/11383.

Este é um bom exemplo de quão diferente o código pode parecer antes e depois enquanto testa essencialmente as mesmas coisas. E como você pode descobrir o que o código deve fazer pesquisando referências, olhando para o histórico do git e comentando diferentes linhas.

Ainda não recebemos um PR dos seguintes usuários:

@email2vimalraj
@andrevargas
@tranotheron
@minerado
@sw-yx
@king0120
@aarboleda1
@danilowoz
@dms1lva
@morajabi
@dphurley
@reznord
@aqumus

Você poderia por favor confirmar se você começou a trabalhar nisso? Eu tenho mais pessoas que querem ajudar na fila, então se você não tiver tempo, seria ótimo dar a outras pessoas a oportunidade de trabalhar nisso.

@andrevargas Acabei de notar sua discussão em https://github.com/facebook/react/pull/11331. Acho que faz sentido manter essas mudanças unificadas lá.

Por favor, me adicione a essa fila @gaearon

@gaearon Sim, você está certo. Só para confirmar, @jeremenichelli está trabalhando em quoteAttributeValueForBrowser-test.js em #11331, e estou ciente disso. Acho que você pode atualizar este tópico com o nome de usuário e o link do PR.

Por favor, também me adicione à fila @gaearon

@gaearon , comecei a trabalhar nisso. Planejando postar minhas descobertas ou um PR em algum momento desta semana.

@gaearon Comecei a trabalhar no SyntheticKeyboardEvent.js. Planejando ter um PR neste fim de semana.

@gaearon Eu também poderia fazer qualquer um dos testes caso as pessoas originalmente designadas não tenham o tempo necessário para trabalhar neles.

@gaearon Desculpe a demora, estou fazendo um WIP PR agora. Atualização: Alguém pode explicar brevemente o que devo fazer para não depender de APIs privadas? Além disso, eu não sei sobre top<EventName> s. Obrigado.

https://github.com/facebook/react/blob/92b7b172cce9958b846844f0b46fd7bbd8c5140d/packages/react-dom/src/events/__tests__/SelectEventPlugin-test.js > extract função

@gaearon Desculpe a demora 😅. Estarei trabalhando nisso hoje e enviarei um ping para você se tiver algumas dúvidas sobre isso.

@morajabi uma maneira potencial de resolver isso

• Veja SelectEventPlugin e entenda qual funcionalidade ele fornece ao usuário
• Escreva o código que faz uso dessa funcionalidade
• Desative o carregamento SelectEventPlugin (comente) e veja o que quebra (certifique-se de que algo quebra)
• O código que você escreveu agora é a primeira versão do seu teste para que você possa colocá-lo em um caso de teste
• Habilite o carregamento de SelectEventPlugin novamente e certifique-se de que o teste seja aprovado
• Otimize seu código

@gaearon desculpas pelo atraso
com base na sua sugestão, tentei comentar algumas partes de EventPluginRegistry.js e encontrei muitos casos de teste falhando ( SyntheticWheelEvent , ReactDOMComponentTree , SyntheticClipboardEvent , SyntheticWheelEvent , inputValueTracking , SimpleEventPlugin , ChangeEventPlugin , ReactDOMComponentTree etc),
Acho que principalmente porque ReactBrowserEventEmitter.js usa registrationNameDependencies que é definido em EventPluginRegistry.js

Embora ao comentar

• linha 208
• linha 38-41

nenhum dos casos de teste falhou (apenas o teste EventPluginRegistry falhou)
Com base nisso, acho que EventPluginRegistry já está coberto por outros conjuntos de testes.

Convenientemente, temos isso no repositório.

não entendi o que você quis dizer com isso

Existe alguma outra sugestão que eu poderia trabalhar para reescrever EventPluginRegistry usando a API pública?

Para outros (não tenho certeza se isso já havia sido transmitido antes), achei o podcast de vídeo @kentcdodds - passo a passo do código do evento react de Ben Alpert muito útil.

Desculpe @gaearon tentei fazer, mas agora não tenho tempo para terminar
Então, se alguém quiser obter meus problemas, sinta-se à vontade :)

@danilowoz @gaearon Se você não se importa, eu poderia usar BeforeInputEventPlugin-test.js.

@timjacobi Qual é o substituto para ReactDOMComponentTree.getInstanceFromNode ?

Além disso, onde devo desativá-lo?

Desative o carregamento SelectEventPlugin (comente-o) e veja o que quebra (certifique-se de que algo quebra)

@morajabi Não tenho certeza se você está lidando com isso no nível certo. Você poderia abrir um WIP PR com o que você tem até agora? Não quero poluir muito este tópico.

@timjacobi Não posso quando não cometi nada de novo. Desculpe, estou muito ocupado esses dias se alguém puder levar SelectEventPlugin-test .

Parece que não precisamos mais de ReactDOMServerIntegration-test (cc @minerado), já que eu cobri isso junto com outras mudanças.

@aqumus Com base em sua análise, removerei EventPluginRegistry-test.js desta lista. Acho que manteremos isso como um teste de unidade desses internos específicos, mas é bom saber que a lógica real é coberta por outros testes.

@king0120 Vou reatribuir getEventCharCode-test para @aarboleda1 porque ele está trabalhando em um teste muito relacionado em https://github.com/facebook/react/pull/11631 , e pode ser mais fácil fazê-los juntos.

@morajabi @gaearon Eu poderia dar uma olhada no SelectEventPlugin-test.js também.

@email2vimalraj FYI, eu reescrevi inputValueTracking-test .

No momento, esses testes não têm um proprietário:

• [ ] getNodeForCharacterOffset-test.js (3/5) tirada por @accordeiro
• [ ] ReactBrowserEventEmitter-test.js (5/5) tirada por @madeinfree
• [ ] BeforeInputEventPlugin-test.js + FallbackCompositionState-test.js (5/5, deve ser combinado) tirada por @GordyD
• [x] SelectEventPlugin-test (2/5) tirada por @skiritsis
• [x] ReactTreeTraversal-test.js (4/5) tirada por @timjacobi

Eu os classifiquei pela minha percepção de sua dificuldade.

Temos uma fila com @timjacobi @kwnccc @skiritsis , então, por favor, vocês três poderiam nos informar se gostariam de fazer algum desses testes (por favor, especifique qual). Você também pode passar, e deixaremos outra pessoa tentar.

Observe que eles estão ficando bem complicados, então não são exatamente amigáveis ​​para iniciantes. Eles não são substitutos mecânicos; você precisará entender o que o teste está tentando verificar e, em seguida, criar um teste de API pública equivalente (que pode parecer muito diferente).

Para fazer isso, você deve se sentir confortável pesquisando coisas por conta própria, semelhante a como @GordyD fez em https://github.com/facebook/react/pull/11383. Na verdade, se @GordyD quiser pegar qualquer um desses, eu ficaria feliz em dar um a ele!

@skiritsis Como você estava interessado, vou transferir SelectEventPlugin-test para você.

Eu gostaria de trabalhar em ReactBrowerEventEmitter-test.js 💪

@gaearon : Obrigado por isso, desculpe por não responder a tempo. Ocupado com outros trabalhos. Vou ver como você reescreveu para meu entendimento.

Posso dar uma olhada em ReactTreeTraversal-test.internal.js

@madeinfree Vamos dar alguns dias para o @kwnccc responder primeiro já que ele já está na fila. Se ele não estiver interessado, eu vou atribuí-lo a você mais tarde.

@gaearon tudo bem! entendi, obrigado ~

@gaearon Vou dar uma olhada na combinação de BeforeInputEventPlugin + FallbackCompositionState se não houver outros compradores.

Parece bom, obrigado @GordyD!

A propósito, aqui estão mais alguns testes de eventos que foram convertidos, para dar uma ideia de como esse código geralmente acaba sendo: https://github.com/facebook/react/pull/11631 https://github. com/facebook/react/pull/11525

@gaearon , fico feliz em receber ReactBrowserEventEmitter-test.js também, se ninguém mais quiser.

@madeinfree

Você ainda está interessado em ReactBrowerEventEmitter ? Se sim, por favor, pegue-o e mantenha-nos atualizados!

@gaearon tudo bem! Eu gostaria de levá-lo.

Você entendeu.

Alguém quer pegar os getNodeForCharacterOffset-test restantes?

Eu posso ajudar com isso ( getNodeForCharacterOffset-test ) :)

@gaearon Não encontrei tempo para mergulhar em ReactIncrementalPerf-test.js como pensei que faria. Peço desculpas por aguentar tanto tempo, mas está disponível se alguém quiser!

@accordeiro Você conseguiu!

@gaearon realmente desculpe, não fui notificado. Se ainda houver alguns testes para cuidar, por favor me avise. Espero que tenha sobrado algo fácil para começar.

@kwnccc Quer ver ReactIncrementalPerf-test.js ?

Posso pesquisar ReactIncrementalPerf-test.js ? Ou, se necessário, posso ajudar o @kwnccc a escrever o teste para ele
Não vejo nenhum arquivo chamado ReactIncrementalPerf.js , então temos que escrever teste para ReactPortal.js ?

Se eu entendi um pouco o problema em ReactIncrementalPerf-test.js (corrija-me se estiver errado), significa que preciso mudar de ReactPortal.createPortal(...) para uma API pública como react-dom com ReactDOM .createPortal(...) ? @gaearon

@gaearon Eu realmente gostaria de experimentar ReactIncrementalPerf-test.js . Desde que @abiduzz420 começou a verificar, poderíamos até nos unir, se necessário.

Sim, claro, @kwnccc , estou feliz em trabalhar com você. Você estava na fila antes de mim, então é todo seu!

@kwnccc Estou recebendo um erro de teste em yarn test e erro de fluxo quando executo yarn flow . eu devo enviar o código para meu repositório bifurcado: https://github.com/abiduzz420/react para que você também possa trabalhar

 FAIL  packages\react-reconciler\src\__tests__\ReactIncrementalPerf-test.internal.js (11.191s)
  ● ReactDebugFiberPerf › supports portals

    Invariant Violation: Target container is not a DOM element.

      at invariant (node_modules/fbjs/lib/invariant.js:42:15)
      at Object.createPortal (packages/react-dom/src/client/ReactDOM.js:1112:70)
      at Object.<anonymous> (packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js:510:116)

$ yarn flow
yarn run v1.3.2
$ node ./scripts/tasks/flow.js
Error: packages/react-reconciler/src/ReactFiberHostContext.js:87
 87:     const nextContext = getChildHostContext(context, fiber.type, rootInstance);
                                                 ^^^^^^^ NoContextT. This type is incompatible with the expected param type of
                    v---------------------------------------------
 31: export default function<T, P, I, TI, HI, PI, C, CC, CX, PL>(
 32:   config: HostConfig<T, P, I, TI, HI, PI, C, CC, CX, PL>,
 33: ): HostContext<C, CX> {
     --------------------^ some incompatible instantiation of `CX`

Error: packages/react-reconciler/src/ReactFiberHostContext.js:87
 87:     const nextContext = getChildHostContext(context, fiber.type, rootInstance);
                                                                      ^^^^^^^^^^^^ NoContextT. This type is incompatible with the expected param type of
                    v---------------------------------------------
 31: export default function<T, P, I, TI, HI, PI, C, CC, CX, PL>(
 32:   config: HostConfig<T, P, I, TI, HI, PI, C, CC, CX, PL>,
 33: ): HostContext<C, CX> {
     --------------------^ some incompatible instantiation of `C`
Found 2 errors
Flow failed
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

@abiduzz420 O problema de fluxo é um problema conhecido no Windows. Não está relacionado (mas precisaremos descobrir por que isso acontece). Consulte https://github.com/facebook/react/issues/11703.

@kwnccc Quanto a ReactIncrementalPerf-test , sim, isso exigirá algum pensamento. Acho que talvez neste momento seja melhor mover temporariamente ReactPortal para shared . Então faça ReactNoop fornecer seu próprio método createPortal() (como ReactDOM ).

Mais um para baixo! https://github.com/facebook/react/issues/11299

@gaearon Movi o ReactPortal para o diretório compartilhado e todos os testes passam. Preciso de um pouco de ajuda na implementação do meu próprio método createPortal() para ReactNoop . Inspirando-se em como createPortal() está escrito em ReactDOM , devo retornar ReactPortal.createPortal(children,container,null,key) .
Estou pensando nestas linhas:

function createPortal( children: ReactNodeList, container: Container, key: ?string = null) {
invariant( 
// TODO: Need to figure out this part of the code
);
return ReactPortal.createPortal(children, container, null, key);
}

Por favor, deixe-me saber se estou fazendo certo?

@gaearon Meu código ainda é um wip. Mas eu queria verificar se estou no caminho certo. Realmente me ajudaria se você pudesse dar uma olhada rápida no meu código e esclarecer algumas dúvidas:

1. A abordagem que tomei está correta?
2. Presumo que os testes precisam cobrir todas as tags e cenários que são testados no
   testes para manter a cobertura do teste. Não tenho certeza se existe uma maneira de gerar componentes dinamicamente com essas tags especiais e de formatação. Você pode me dar algumas dicas sobre uma maneira eficiente de conseguir isso?
3. Não tenho certeza de como testar a parte 'sem contexto' do teste 'qualquer tag sem contexto' com API pública porque o método isTagValidInContext() não é usado em nenhum outro lugar, exceto no arquivo de teste. Alguma ideia?

@abiduzz420 Sim, isso parece certo

@anushreesubramani

A abordagem que tomei está correta?

Em geral, sim, mas queremos evitar a duplicação. Idealmente, deve passar de uma série de

expect(isTagStackValid(['a', 'a'])).toBe(false);

a uma série de

expectInvalidNestingWarning(true, ['a', 'a']);

onde expectInvalidNestingWarning é uma função personalizada que gera o componente e, em seguida, afirma que a renderização produz um aviso.

Não tenho certeza se existe uma maneira de gerar componentes dinamicamente com essas tags especiais e de formatação. Você pode me dar algumas dicas sobre uma maneira eficiente de conseguir isso?

Sim, estou pensando em algo como:

function expectInvalidNestingWarning(shouldWarn, tags) {
  let element = null;
  tags = [...tags];
  while (tags.length) {
    element = React.createElement(tags.pop(), null, element);
  }
  const container = document.createElement('div');
  ReactDOM.render(element, container);
  // assert either a warning or lack of one based on shouldWarn
}

Percorremos o array, pegamos o último item e envolvemos o elemento atual em um pai com a tag correspondente. Desta forma, no final, acabamos com a árvore correspondente. Posso ter escrito algo errado, mas essa é a ideia geral.

Você provavelmente também vai querer colocar algo como

jest.resetModules();
React = require('react');
ReactDOM = require('react-dom');

nessa função logo antes da renderização porque, caso contrário, os avisos podem ser desduplicados e não podemos testá-los de forma confiável.

Não tenho certeza de como testar a parte 'sem contexto' do teste 'qualquer tag sem contexto' com a API pública porque o método isTagValidInContext() não é usado em nenhum outro lugar, exceto no arquivo de teste

Olhando para a culpa, ele foi adicionado em https://github.com/facebook/react/commit/76bb96ef21b7c665e1b51b6bb90e64ec40c0f16a e nesse ponto também foi chamado fora dos testes. Mas em algum momento no futuro não foi mais usado. O teste menciona a renderização do servidor:

https://github.com/facebook/react/blob/8cbc16f0faedafe4f7424b286af52dafd7a79587/packages/react-dom/src/__tests__/validateDOMNesting-test.internal.js#L144 -L145

mas esta função também não é mais usada com renderização do servidor.

A partir deste comentário, deduzo que o objetivo é garantir que nunca avisemos quando não conhecemos os ancestrais . No entanto, não consigo encontrar um caminho de código que passe null como ancestorInfo para validateDOMNesting . Portanto, provavelmente sempre conhecemos os ancestrais na versão atual. Então, eu diria que é seguro excluir este teste completamente.

@gaearon Eu criei o método para createPortal() em ReactNoop.js e antes disso eu também mudei o arquivo ReactPortal.js para o diretório compartilhado como você sugeriu. Por favor, veja meu código, e se houver alguma modificação ou adição que eu precise fazer, eu o farei.

Pode enviar um PR por favor? É mais fácil discutir em uma revisão.

@abiduzz420 Você parece ter feito um ótimo trabalho, desculpe, mas não tive tempo de começar a trabalhar nisso antes de hoje! Muito feliz por você ter conseguido completar o teste! 👏👏
@gaearon no próximo vou ter certeza que terei uma grande disponibilidade

Atualização rápida do @gaearon : comecei a refatorar/combinar testes BeforeInputEventPlugin + FallbackCompositionState . Eu tenho um bom controle sobre como testar a implementação por meio da API pública. Agora estou trabalhando na criação de casos de teste para exercitar os diferentes caminhos de código dependendo dos diferentes ambientes de execução/motores de navegador. Espero ter um primeiro PR até o final desta semana (até 10 de dezembro - atualizado, preciso de um pouco mais de tempo - olhando para 12 de dezembro).

Legal, obrigado pela atualização!

@gaearon atualização rápida do meu lado: eu já comecei a trabalhar para reescrever os testes para getNodeForCharacterOffset-test e devo conseguir enviar um PR até quinta-feira – tudo bem?

Parece bom

Mais um para baixo! https://github.com/facebook/react/pull/11742

@reznord Ainda não ouvimos falar de você - você começou alguma coisa? Se você estiver muito ocupado, talvez seja melhor dar a outra pessoa a chance de tentar.

Ping @reznord

Oi @gaearon , Posso receber ReactErrorUtils-test.js para minha primeira contribuição?

oi, @gaearon há algo que eu possa fazer em ReactErrorUtils-test.js

Oi, Alguém pode me ajudar a continuar o teste ReactBrowserEventEmitter-test.js? Porque estou ocupado no meu trabalho agora sem tempo para continuar, o PR é https://github.com/facebook/react/pull/11713 , muito obrigado !!

Obrigado a todos novamente! Ainda há alguns testes pendentes, mas acho que podemos fechá-lo.

@gaearon : ReactErrorUtils-test.js Eu gostaria de trabalhar nisso. pode confirmar se consigo retirar?