<element> .innerText dans le code de la méthode des composants ne fonctionne pas correctement dans les tests enzymatiques. Test réagissent avec le composant Jest + enzyme (montage())

Question

En utilisant l'enzyme + + React Jest

Bonjour, je propriété .innerText pour obtenir la valeur de certains éléments, voir la ligne n ° 5 de mon code:

_modifyProfileField (event) { 
    const { currentAgentProfile, agentsDatabase } = this.state; 
    const eventTarget = event.target; 
    const agentToMod = currentAgentProfile; 
    const valueToSave = event.target.innerHTML !=='<br>' 
     ? eventTarget.innerText 
     : ''; 

    if (agentToMod[eventTarget.id] !== valueToSave) { 
     const style = eventTarget.id === 'name' 
      ? Styles.nameSaving 
      : Styles.saving; 

     eventTarget.classList.add(style); 
     const hideSaver = setTimeout(() => { 
      eventTarget.classList.remove(style); 
      clearTimeout(hideSaver); 
     }, 300); 

     agentToMod[eventTarget.id] = valueToSave; 

     const newData = agentsDatabase.map((agent) => { 
      return agent.id === agentToMod.id 
       ? agentToMod 
       : agent; 
     }); 

     this.setState({ 
      agentsDatabase:  newData, 
      currentAgentProfile: agentToMod 
     }); 

     document.activeElement.blur(); 
     window.getSelection().removeAllRanges(); 
    } 
} 

Lorsque j'essaie d'exécuter cette méthode pour tester dans l'enzyme, event.target.innerHTML renvoie undefined. La modification de innerText en innerHTML est inacceptable en raison des exigences du projet. Est-il possible de faire comprendre à l'enzyme innerText de mon code?

Voici mon code enzyme:

expect(result 
    .state() 
    .currentAgentProfile.Country) 
    .toBe(country); 

for (const location of locations) { 
    result.find('#Country').node.innerHTML = location.city; 

    expect(result.find('#Country').text()).toBe(location.city); 

    result.find('#Country').simulate('keydown', { key: 'Enter', keyCode: 13, which: 13 }); 

    result.find('#Country').simulate('blur'); 

    expect(result 
     .state() 
     .currentAgentProfile.Country) 
     .toBe(location.city); 
} 

La simulation blur() déclenche ma méthode.

Answer 1

Voir cette réponse:

innerText vs textContent - getting some errors on Firefox

en bref: var text = elem.textContent || elem.innerText;

vous pourriez donc faire quelque chose comme ceci:

const valueToSave = event.target.innerHTML !=='<br>' 
     ? eventTarget.innerText || eventTarget.textContent 
     : '';