React: Exprimez plus de tests via l'API publique

Je peux jeter un coup d'œil à cela au cours du week-end et voir si je peux y faire face à court terme.

Grand merci! Si vous choisissez un test particulier, veuillez commenter avec le nom du fichier dans le fil de discussion afin que quelqu'un d'autre ne commence pas à travailler sur le même test.

Je suis certainement très intéressé à contribuer à cela. Je vais regarder à travers ce week-end et trouver une opportunité de refactoriser!

ça m'intéresse aussi 👍

J'ai publié une liste de tests dans le premier post. Faites-moi savoir lesquels vous aimeriez prendre et je vous les attribuerai.

ReactDOMInput-test me va bien :)

@SadPandaBear Vous l'avez !

Je peux travailler sur ReactErrorUtils-test . 😄

Je vais jeter un oeil à setInnerHTML-test.js

Je vais faire getEventCharCode-test.js . 😀

Je peux travailler sur getEventKey-test.js .

Je peux prendre escapeTextContentForBrowser-test.js .

J'aimerais essayer ChangeEventPlugin-test.js :)

Je peux prendre SyntheticEvent-test.js

J'aimerais travailler sur EnterLeaveEventPlugin-test.js

J'aimerais travailler sur ReactDOMEventListener-test.js

Je voudrais prendre BeforeInputEventPlugin-test.js

J'aimerais prendre SyntheticKeyboardEvent-test.js. Merci 👍

Laisse-moi prendre inputValueTracking-test.js

J'aimerais travailler sur SyntheticWheelEvent-test.js

Puis-je prendre : ReactBrowserEventEmitter-test.js ?

Je prends SelectEventPlugin-test.js

J'aimerais travailler sur ReactDOMComponentTree-test.js

J'aimerais travailler sur ReactTreeTraversal-test.js

salut! 👋 J'aimerais travailler sur ReactCoroutine-test.js

Je peux prendre SyntheticClipboardEvent-test.js

J'aimerais travailler sur validateDOMNesting-test.js

Je pourrais prendre EventPluginRegistry-test.js

J'aimerais essayer ReactDOMComponent-test.js

Bonjour! J'aimerais essayer quoteAttributeValueForBrowser-test.js ! :muscle:

Bonjour! J'aimerais essayer ReactDOMServerIntegration-test.js !

Je vais prendre ReactIncrementalPerf-test.js

Je vais faire getNodeForCharacterOffset-test.js

@burnsbeaver Lequel est-ce, FallbackCompisitionState-test ou getNodeForCharacterOffset-test ? Nous aimerions commencer avec un test par personne.

getNodeForCharacter s'il vous plaît. J'ai supprimé l'autre commentaire, désolé pour la confusion !

Nous avons encore FallbackCompositionState-test.js et ReactFiberHostContext-test.js gratuits !

Je vais prendre FallbackCompisitionState !

Je peux essayer le ReactFiberHostContext-test.js

Mise à jour : tous les tests sont passés maintenant. Abonnez-vous à ce numéro ! Ils pourraient se libérer à l'avenir si quelqu'un n'a pas le temps de terminer le travail. Nous commenterons si un test devient disponible pour réessayer.

À toutes les personnes qui ont passé les tests, merci ! Je tiens à réitérer que la solution n'est pas toujours claire et, dans certains cas, il peut même ne pas être possible de tester raisonnablement le comportement sans quelques modifications de la source React elle-même. Si jamais vous vous sentez coincé, commentez ici, et nous essaierons de trouver un plan.

@adsonpleal Désolé de vous décevoir - je viens de vérifier, et malheureusement, nous avons accidentellement déjà corrigé ReactFiberHostContext-test . Je ne m'en étais pas rendu compte au début, mais ce TODO est obsolète. C'est le seul test que je peux voir qui est déjà corrigé.

@gaearon Wow, refactoriser ReactDOMInput-test va me prendre du temps mais j'espère tout finir ce week-end.

J'ai un petit doute :
Est-il acceptable de remplacer tout ce comportement de la fonction setUntrackedValue qui utilise inputValueTracking par quelque chose comme ReactTestUtils.Simulate.? ?

Au fait, vous pouvez consulter mon PR ici pour voir ce que j'ai fait pour supprimer les inputValueTracking . Je sais que certains de ces tests peuvent s'appuyer sur des éléments très spécifiques de inputValueTracking , mais je me demandais simplement si ReactTestUtils pouvait effectivement être utilisé à la place.

Pour inputValueTracking @jquense devrait avoir le plus de contexte sur la meilleure façon de le faire. Mais tant que vous le faites fonctionner, nous pouvons examiner et voir si l'approche fonctionne ou non.

Juste un avertissement à quelqu'un d'autre, j'avais une ancienne version de yarn installée (0.22) et j'essayais d'exécuter les tests localement et tout se cassait. La mise à niveau du fil vers la dernière version (1.2.1) a résolu le problème et les tests se déroulent correctement maintenant.

@sadpandabear J'ai le même module dans mon fichier de test donc je vais bientôt vérifier votre implémentation

@gaearon Pour les tests setInnerHTML , ils ont l'impression de dépendre de l'existence de setInnerHTML pour que la suite de tests ait un sens.

Je peux écrire des tests pour remplacer les fonctions existantes, mais la suite de tests est plus dans le sens de la définition du html interne, par rapport à tout ce qui est spécifique à setInnerHTML . Je suppose que je m'accroche un peu à la dénomination de la suite de tests.

EDIT : Sauf erreur de ma part... les SVG ont une propriété innerHTML . Pas sûr que le deuxième bloc de tests de ce fichier soit même nécessaire.

@silvestrijonathan Je pense que ce que ces tests essaient vraiment de vérifier, c'est que dangerouslySetInnerHTML fonctionne comme prévu dans React. Donc, si vous modifiez ces tests pour utiliser ReactDOM et rendre le même contenu avec dangerouslySetInnerHTML , cela devrait suffire. Vous pouvez renommer le test en dangerouslySetInnerHTML-test si vous pensez que ce serait plus approprié.

Après quelques heures à jouer avec mon fichier de test, j'ai une forte suggestion pour les nouveaux arrivants (comme moi) : commencez vos tests avec un env (fichier) propre.
J'éditais le fichier existant et il se moquait de certaines fonctions internes, donc quelques fonctions ReactTestUtils étaient cassées !! Il m'a fallu un certain temps pour comprendre pourquoi les choses ne fonctionnaient pas comme prévu...

@gaearon Je pense que nous devons préciser que ReactTestUtils , y compris la simulation d'événements, doit être considérée comme une API privée. Cela atteint indirectement les API internes, donc cela ne nous permet pas de tester correctement comment cela fonctionnerait autrement. Par exemple, cela entravera notre capacité à tester les packages compilés sans exposer ces crochets et cela ne nous permettra pas de tester un nouveau système d'événements non synthétiques.

@dphurley , j'ai remarqué que vous travaillez sur ReactIncrementalPerf-test . Je travaillais également sur une suite de tests qui utilise ReactCoroutine , donc je voulais vous donner un aperçu de ce PR : #11338.
Je ne sais pas si vous avez déjà soumis un PR, mais si ce n'est pas le cas, il peut être judicieux de le baser sur # 11338 (s'il est accepté).

@gaearon Merci pour vos conseils. J'ai pensé à utiliser React-DOM avec dangerouslySetInnerHTML pour les tests, donc je vais procéder de cette façon !

Et oui, je vais probablement renommer les tests en cela dans ce cas. Recherchez mon PR dans le jour suivant ou ainsi.

Nous avons le premier PR fusionné !

Jetez-y un œil : https://github.com/facebook/react/pull/11309

Si vous travaillez sur quoi que ce soit lié aux événements, je vous suggère de lire à la fois les discussions sur https://github.com/facebook/react/pull/11309 et les critiques sur :

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

Il existe quelques thèmes communs, et il peut être utile d'utiliser ces discussions pour orienter d'autres PR dans la bonne direction.

Grands convos à référence-merci!

Le travail a été un peu chargé, mais je pense que je pourrai ouvrir un PR ce week-end pour mes tests.

Je n'ai pas encore examiné le test que j'ai choisi. J'étais occupé avec d'autres choses. Je vais essayer de faire un PR dans quelques jours, puis-je gagner du temps ?

Sonne bien, bien sûr!

j'ai eu le même problème

Un autre PR fusionné ! https://github.com/facebook/react/pull/11316

Deux autres vers le bas. https://github.com/facebook/react/pull/11317 https://github.com/facebook/react/pull/11385

J'ai écrit une petite analyse sur la façon dont j'ai abordé l'un des tests. https://github.com/facebook/react/pull/11385#issuecomment -341934588

pour autant que je sache, ils sont tous pris, veuillez poster ici s'il y en a, libérez-vous et je regarderai

J'ai fusionné deux autres PR qui traitent spécifiquement des SyntheticEvent s. Si vous avez passé des tests connexes, veuillez les consulter et essayer de faire correspondre le style et l'approche : https://github.com/facebook/react/pull/11365 et https://github.com/facebook/react/issues/ 11299

@gaearon Pour EventPluginRegistry-test.js , comment devrions-nous réécrire le test en utilisant l'API publique, je vois que nous injectons des plugins par défaut dans ReactDom.js -> ReactDOMClientInjection.js
{
Plugin SimpleEvent,
EnterLeaveEventPlugin,
ChangeEventPlugin,
SelectEventPlugin,
AvantInputEventPlugin,
}

Alors, comment exactement pourrions-nous injecter notre plugin de simulation de test et tester la fonctionnalité EventPluginRegistry
J'ai recherché n'importe quel plugin personnalisé et j'ai trouvé react-tap-event-plugin pour vérifier exactement comment les plugins personnalisés sont injectés.
Est- ce la seule façon d'injecter des plugins

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

Je crains d'être bien au-dessus de ma tête sur ReactTreeTraversal-test.js
Si quelqu'un d'autre veut essayer, n'hésitez pas à le faire.

@aqumus

EventPluginRegistry est délicat. Je suppose que la première étape serait de déterminer où il est réellement utilisé. Vous avez raison de dire que le plug-in d'événement tap est le seul que nous nous engageons encore à prendre en charge. Idéalement, nous l'avons directement dans le référentiel. Alors peut-être pouvons-nous ajouter un test qui fonctionne spécifiquement ?

Il est également probable que RN utilise EventPluginRegistry . Avons-nous des tests vérifiant le fonctionnement des événements RN ? Je ne sais pas. Cela vaut la peine de commenter différentes parties de EventPluginRegistry et de vérifier si des tests échouent. Nous pouvons supprimer ses tests d'API privés si le même code est déjà couvert par d'autres tests qui mettent l'accent sur ces chemins de code. Est-ce que ça a du sens?

@gdevincenzi Ça a l'air bien, je vais supprimer l'affectation.

De plus, je vais être absent cette semaine, mais s'il vous plaît, ne laissez pas cela vous empêcher de continuer. J'espère que quelques autres PR soumis seront fusionnés la semaine prochaine.

je peux prendre ReactTreeTraversal-test.js - c'est une API inconnue mais semble être une bonne occasion de l'apprendre. conseil bienvenu @gdevincenzi

Félicitations à @gordyd pour en avoir terminé un plutôt complexe : https://github.com/facebook/react/pull/11383.

Ceci est un bon exemple de la façon dont le code peut être différent avant et après tout en testant essentiellement les mêmes choses. Et comment vous pouvez comprendre ce que le code est censé faire en recherchant des références, en consultant l'historique de git et en commentant différentes lignes.

Nous n'avons pas encore reçu de PR des utilisateurs suivants :

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

Pourriez-vous s'il vous plaît confirmer si vous avez commencé à travailler là-dessus ? J'ai plus de gens qui veulent aider dans la file d'attente, donc si vous n'avez pas le temps, ce serait bien de donner aux autres l'occasion de travailler là-dessus.

@andrevargas Je viens de remarquer votre discussion sur https://github.com/facebook/react/pull/11331. Je suppose qu'il est logique de garder ces changements unifiés là-bas.

S'il vous plaît ajoutez-moi à cette file d'attente @gaearon

@gaearon Oui, vous avez raison. Juste pour confirmer, @jeremenichelli travaille sur quoteAttributeValueForBrowser-test.js dans #11331, et j'en suis conscient. Je pense que vous pouvez mettre à jour ce fil avec son nom d'utilisateur et le lien de PR.

Veuillez également m'ajouter à la file d'attente @gaearon

@gaearon j'ai commencé à travailler dessus. Je prévois de publier mes découvertes ou un PR cette semaine.

@gaearon J'ai commencé à travailler sur SyntheticKeyboardEvent.js. Planification d'avoir un PR ce week-end.

@gaearon Je pourrais également prendre n'importe lequel des tests au cas où les personnes initialement affectées n'auraient pas le temps nécessaire pour y travailler.

@gaearon Désolé pour le long retard, je fais un WIP PR maintenant. Mise à jour : quelqu'un peut-il expliquer brièvement ce que je dois faire pour ne pas compter sur des API privées ? De plus, je ne connais pas les top<EventName> s. Merci.

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

@gaearon Désolé pour le long retard 😅. Je vais y travailler aujourd'hui et je vous contacterai si j'ai des doutes à ce sujet.

@morajabi une façon potentielle de résoudre ce problème

• Regardez SelectEventPlugin et comprenez quelle fonctionnalité il offre à l'utilisateur
• Écrire du code qui utilise cette fonctionnalité
• Désactivez le chargement SelectEventPlugin (commentez-le) et voyez ce qui casse (assurez-vous que quelque chose casse)
• Le code que vous avez écrit est maintenant la première version de votre test, vous pouvez donc le mettre dans un cas de test
• Activez à nouveau le chargement SelectEventPlugin et assurez-vous que le test réussit
• Optimisez votre code

@gaearon excuses pour le retard
sur la base de votre suggestion, j'ai essayé de commenter quelques parties de EventPluginRegistry.js et j'ai trouvé beaucoup de cas de test échouant ( SyntheticWheelEvent , ReactDOMComponentTree , SyntheticClipboardEvent , SyntheticWheelEvent , inputValueTracking , SimpleEventPlugin , ChangeEventPlugin , ReactDOMComponentTree etc.),
Je suppose principalement parce que ReactBrowserEventEmitter.js utilise registrationNameDependencies qui est défini dans EventPluginRegistry.js

Bien que lorsque vous commentez

• ligne 208
• ligne 38-41

aucun des cas de test n'a échoué (seulement EventPluginRegistry test a échoué)
Sur cette base, je suppose que EventPluginRegistry est déjà couvert par d'autres suites de tests.

Idéalement, nous l'avons directement dans le référentiel.

je n'ai pas compris ce que tu voulais dire par là

Y a-t-il une autre suggestion sur laquelle je pourrais travailler pour réécrire EventPluginRegistry en utilisant l'API publique ?

Pour les autres (je ne sais pas si cela avait été diffusé auparavant), j'ai trouvé le podcast vidéo @kentcdodds - procédure pas à pas du code d'événement de réaction par Ben Alpert très utile.

Désolé @gaearon j'ai essayé de le faire, mais maintenant je n'ai pas le temps de le finir
Donc, si quelqu'un d'autre veut obtenir mes problèmes, n'hésitez pas :)

@danilowoz @gaearon Si cela ne vous dérange pas, je pourrais prendre BeforeInputEventPlugin-test.js.

@timjacobi Quel est le remplacement de ReactDOMComponentTree.getInstanceFromNode ?

Aussi, où dois-je le désactiver ?

Désactivez le chargement de SelectEventPlugin (commentez-le) et voyez ce qui casse (assurez-vous que quelque chose casse)

@morajabi Je ne suis pas sûr que vous abordiez cela au bon niveau. Pourriez-vous ouvrir un WIP PR avec ce que vous avez jusqu'à présent ? Je ne veux pas trop polluer ce fil.

@timjacobi Je ne peux pas quand je n'ai rien commis de nouveau. Je suis désolé, je suis assez occupé ces jours-ci si quelqu'un peut prendre SelectEventPlugin-test .

Il semble que nous n'ayons plus besoin ReactDOMServerIntegration-test (cc @minerado) car je l'ai couvert avec d'autres changements.

@aqumus Sur la base de votre analyse, je supprimerai EventPluginRegistry-test.js de cette liste. Je pense que nous garderons cela comme un test unitaire de ces composants internes particuliers, mais il est bon de savoir que la logique réelle est couverte par d'autres tests.

@ king0120 Je vais réaffecter getEventCharCode-test à @aarboleda1 car il travaille sur un test très connexe dans https://github.com/facebook/react/pull/11631 , et il pourrait être plus facile de les faire ensemble.

@morajabi @gaearon Je pourrais également jeter un œil à SelectEventPlugin-test.js.

@email2vimalraj Pour info , j'ai réécrit inputValueTracking-test .

Ces tests n'ont actuellement pas de propriétaire :

• [ ] getNodeForCharacterOffset-test.js (3/5) prise par @accordeiro
• [ ] ReactBrowserEventEmitter-test.js (5/5) pris par @madeinfree
• [ ] BeforeInputEventPlugin-test.js + FallbackCompositionState-test.js (5/5, devrait être combiné) pris par @GordyD
• [x] SelectEventPlugin-test (2/5) pris par @skiritsis
• [x] ReactTreeTraversal-test.js (4/5) prise par @timjacobi

Je les ai triés selon ma perception de leur difficulté.

Nous avons une file d'attente avec @timjacobi @kwnccc @skiritsis , alors s'il vous plaît, pourriez-vous tous les trois nous faire savoir si vous souhaitez passer l'un de ces tests (veuillez préciser lequel). Vous pouvez aussi passer, et nous laisserons quelqu'un d'autre essayer.

Notez que ceux-ci deviennent assez compliqués, ils ne sont donc pas vraiment adaptés aux débutants. Ce ne sont pas des remplacements mécaniques; vous devrez comprendre ce que le test essaie de vérifier, puis proposer un test d'API public équivalent (qui peut sembler très différent).

Pour les prendre, vous devriez être à l'aise pour faire des recherches par vous-même, comme @GordyD l'a fait dans https://github.com/facebook/react/pull/11383. En fait, si @GordyD souhaite en prendre un, je serais heureux de lui en donner un !

@skiritsis Puisque vous étiez intéressé, je vais vous réattribuer SelectEventPlugin-test .

J'aimerais travailler sur ReactBrowerEventEmitter-test.js 💪

@gaearon : Merci pour cela, désolé de ne pas avoir répondu à temps. Occupé par d'autres travaux. Je vais regarder comment vous avez réécrit pour ma compréhension.

Je peux jeter un œil à ReactTreeTraversal-test.internal.js

@madeinfree Donnons quelques jours à @kwnccc pour répondre en premier puisqu'il est déjà dans la file d'attente. S'il n'est pas intéressé, je vous l'attribuerai plus tard.

@gaearon D'accord ! j'ai compris, merci ~

@gaearon Je vais essayer de combiner BeforeInputEventPlugin + FallbackCompositionState s'il n'y a pas d'autres preneurs.

Ça sonne bien, merci @GordyD !

Au fait, voici quelques autres tests d'événements qui ont été convertis, pour vous donner une idée de ce à quoi ressemble généralement ce code : https://github.com/facebook/react/pull/11631 https://github. com/facebook/react/pull/11525

@gaearon Je suis heureux de prendre ReactBrowserEventEmitter-test.js aussi si personne d'autre ne le veut.

@madeinfree

Êtes-vous toujours intéressé par ReactBrowerEventEmitter ? Si c'est le cas, prenez-le et tenez-nous au courant !

@gaearon D'accord ! Je voudrais le prendre.

Tu l'as eu.

Quelqu'un veut prendre les getNodeForCharacterOffset-test restants ?

Je peux aider avec celui-ci ( getNodeForCharacterOffset-test ) :)

@gaearon Je n'ai pas trouvé le temps de plonger dans ReactIncrementalPerf-test.js comme je le pensais. Toutes mes excuses pour l'avoir conservé si longtemps, mais c'est à gagner si quelqu'un le veut !

@accordeiro Vous l'avez compris !

@gaearon vraiment désolé, je n'ai pas été averti. S'il reste des tests à faire, merci de me le faire savoir. J'espère qu'il reste quelque chose de facile pour commencer.

@kwnccc Tu veux regarder dans ReactIncrementalPerf-test.js ?

Puis-je regarder dans ReactIncrementalPerf-test.js ? Ou si nécessaire, je peux aider @kwnccc à écrire un test pour cela
Je ne vois aucun fichier nommé ReactIncrementalPerf.js , alors devons-nous écrire test pour ReactPortal.js ?

Si j'ai même un peu compris le problème dans ReactIncrementalPerf-test.js (corrigez-moi si je me trompe), cela signifie que je dois passer de ReactPortal.createPortal(...) à une API publique comme react-dom avec ReactDOM .createPortal(...) ? @gaearon

@gaearon J'aimerais vraiment essayer ReactIncrementalPerf-test.js . Depuis que @abiduzz420 a commencé à le vérifier, nous pourrions même faire équipe si nécessaire.

Oui, bien sûr @kwnccc, je suis heureux de travailler avec vous. Vous étiez en file d'attente avant moi, alors tout à vous !

@kwnccc Je reçois une erreur de test dans yarn test et une erreur de flux lorsque j'exécute yarn flow . je pousserai le code sur mon repo forké : https://github.com/abiduzz420/react afin que vous puissiez également travailler dessus

 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 Le problème de flux est un problème connu sous Windows. Ce n'est pas lié (mais nous devrons comprendre pourquoi cela se produit). Voir https://github.com/facebook/react/issues/11703.

@kwnccc En ce qui concerne ReactIncrementalPerf-test , oui, cela nécessitera une réflexion. Je pense qu'à ce stade, il est peut-être préférable de déplacer temporairement ReactPortal vers shared . Demandez ensuite ReactNoop fournir sa propre méthode createPortal() (comme le fait ReactDOM ).

Un de plus ! https://github.com/facebook/react/issues/11299

@gaearon J'ai déplacé ReactPortal vers un répertoire partagé et tous les tests réussissent. Besoin d'un peu d'aide pour implémenter ma propre méthode createPortal() pour ReactNoop . En m'inspirant de la façon dont createPortal() est écrit en ReactDOM , je retournerai ReactPortal.createPortal(children,container,null,key) .
Je pense à ces lignes:

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);
}

Merci de me dire si je fais bien ?

@gaearon Mon code est toujours un wip. Mais je voulais vérifier si je suis sur la bonne voie. Cela m'aiderait vraiment si vous pouviez jeter un coup d'œil rapide à mon code et clarifier quelques doutes:

1. L'approche que j'ai prise est-elle correcte?
2. Je suppose que les tests doivent couvrir toutes les balises et tous les scénarios testés dans l'existant
   tests afin de maintenir la couverture des tests. Je ne sais pas s'il existe un moyen de générer dynamiquement des composants avec ces balises spéciales et de formatage. Pouvez-vous me donner quelques conseils sur un moyen efficace d'y parvenir?
3. Je ne sais pas comment tester la partie 'sans contexte' du test 'toute balise sans contexte' avec l'API publique car la méthode isTagValidInContext() n'est utilisée nulle part ailleurs que dans le fichier de test. Des idées?

@ abiduzz420 Oui, ça sonne bien

@anushreesubramani

L'approche que j'ai prise est-elle correcte?

En général, oui, mais nous voudrons éviter les doubles emplois. Idéalement, il devrait s'agir d'une série de

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

à une série de

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

où expectInvalidNestingWarning est une fonction personnalisée qui génère le composant, puis affirme que son rendu produit un avertissement.

Je ne sais pas s'il existe un moyen de générer dynamiquement des composants avec ces balises spéciales et de formatage. Pouvez-vous me donner quelques conseils sur un moyen efficace d'y parvenir?

Oui, je pense à quelque chose comme :

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
}

Nous parcourons le tableau, prenons le dernier élément et enveloppons l'élément actuel dans un parent avec la balise correspondante. De cette façon, à la fin, nous nous retrouvons avec l'arbre correspondant. J'ai peut-être écrit quelque chose de mal, mais c'est l'idée générale.

Vous voudrez probablement aussi mettre quelque chose comme

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

dans cette fonction juste avant le rendu car sinon les avertissements peuvent être dédupliqués et nous ne pouvons pas les tester de manière fiable.

Je ne sais pas comment tester la partie 'sans contexte' du test 'toute balise sans contexte' avec l'API publique car la méthode isTagValidInContext() n'est utilisée nulle part ailleurs que dans le fichier de test

En regardant le blâme, il a été ajouté dans https://github.com/facebook/react/commit/76bb96ef21b7c665e1b51b6bb90e64ec40c0f16a et à ce moment-là, il a également été appelé en dehors des tests. Mais à un moment donné dans le futur, il n'a plus été utilisé. Le test mentionne le rendu de serveur :

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

mais cette fonction n'est plus utilisée avec le rendu serveur non plus.

D'après ce commentaire, je déduis que le but est de s'assurer que nous ne prévenons jamais lorsque nous ne connaissons pas les ancêtres . Cependant, je ne trouve pas de chemin de code qui passerait null comme ancestorInfo à validateDOMNesting . Par conséquent, nous connaissons probablement toujours les ancêtres dans la version actuelle. Je dirais donc qu'il est prudent de supprimer complètement ce test.

@gaearon J'ai créé la méthode pour createPortal() dans ReactNoop.js et avant cela, j'avais également déplacé le fichier ReactPortal.js vers le répertoire partagé comme vous l'avez suggéré. Veuillez parcourir mon code, et s'il y a des modifications ou des ajouts supplémentaires que je dois faire, je le ferai.

Pouvez-vous envoyer un PR s'il vous plaît? C'est plus facile d'en discuter dans un avis.

@abiduzz420 Vous semblez avoir fait du bon boulot, désolé mais je n'ai pas eu le temps de commencer à travailler dessus avant aujourd'hui ! Vraiment content que vous ayez pu passer le test ! 👏👏
@gaearon ensuite je m'assurerai d'avoir une grande disponibilité

Mise à jour rapide de @gaearon : j'ai commencé à refactoriser/combiner les tests BeforeInputEventPlugin + FallbackCompositionState . J'ai une bonne idée de la façon de tester l'implémentation via l'API publique. Je travaille maintenant sur la création de cas de test pour tester les différents chemins de code en fonction des différents environnements d'exécution/moteurs de navigation. Je m'attends à avoir un premier PR vers la fin de cette semaine (d'ici le 10 décembre - mis à jour, j'ai besoin d'un peu plus de temps - en regardant le 12 décembre).

Bien, merci pour la mise à jour !

@gaearon mise à jour rapide de mon côté : j'ai déjà commencé à travailler sur la réécriture des tests pour getNodeForCharacterOffset-test et je devrais pouvoir pousser un PR jusqu'à jeudi - est-ce que ça va ?

Ça a l'air bien

Un de plus ! https://github.com/facebook/react/pull/11742

@reznord Nous n'avons pas encore entendu parler de vous - avez-vous commencé quelque chose ? Si vous êtes trop occupé, il est peut-être préférable de donner à quelqu'un d'autre une chance d'essayer.

Ping @reznord

Salut @gaearon , puis-je prendre ReactErrorUtils-test.js pour ma première contribution ?

salut, @gaearon y a-t-il quelque chose que je peux faire en ReactErrorUtils-test.js

Salut, Est-ce que quelqu'un peut m'aider à continuer le test ReactBrowserEventEmitter-test.js ? Parce que je vais être occupé sur mon travail maintenant pas le temps de continuer, le PR est https://github.com/facebook/react/pull/11713 , merci beaucoup !!

Merci encore à tous ! Il reste encore quelques tests en suspens mais je pense que nous pouvons le clore.

@gaearon : ReactErrorUtils-test.js J'aimerais travailler dessus. pouvez-vous confirmer si je peux le récupérer ?