React-dnd: Testen mit Enzym statt React TestUtils

Erstellt am 26. Nov. 2017  ·  3Kommentare  ·  Quelle: react-dnd/react-dnd

Ich schreibe einige Tests, befolge diese Dokumentation und auch diese Ausgabe https://github.com/react-dnd/react-dnd/issues/453

Das Problem, das ich habe, betrifft das Test-Rendering.

Ich kann das Beispiel aus der Dokumentation zum Funktionieren abrufen, indem ich die Komponente in einen DragDropContext einpacke und sie mit TestUtils.renderIntoDocument rendere.

Dies gibt ein DragDropContextContainer Objekt zurück.

Wenn ich jedoch versuche, die Enyzme-Methode mount zum Rendern des Objekts zu verwenden, wird ein $$typeof: Symbol(react.element) -Objekt zurückgegeben - wodurch ich den Manager nicht abrufen kann.

Ich würde es vorziehen, Enzyme zu verwenden - da ich das für meine Tests anderswo verwende.

Hat jemand dabei Hilfe?

wontfix

Hilfreichster Kommentar

Hatte das gleiche Problem. Ich könnte und erwarte, dass Sie es mit der Methode wrapper.instance() beheben können. Auch hier beschrieben https://github.com/react-dnd/react-dnd/issues/488.

z.B

const Context = wrapInTestContext(Component)
const wrapper = mount(<Context />)
const manager = wrapper.instance().getManager()
const backend = manager.getBackend()

Außerdem musste ich die Instanzen der untergeordneten Komponenten dazu bringen, getHandlerId() aufzurufen.

Wenn es hilft, hier eine meiner Testdateien: https://gist.github.com/gilleswittenberg/142fe49e1115b5a1936562b2284e1ab7

Alle 3 Kommentare

Ich habe das gerade zum Laufen gebracht, so sieht es aus. im Typoskript.

import { ThingIAmTesting } from '../file/where/it/lives';
describe('It is a test!', () => {
  let props;
  let component;
  const getComponent = () => {
    let OriginalComponent = (ThingIAmTesting as any).DecoratedComponent;
    let identity = el => el;
    if (!component) {
      component = Enzyme.shallow(
        <OriginalComponent {...props} connectDragSource={identity} />
       );
      return component
    }

    beforeEach (() => {
      props = {
         prop: 'stuff',
         }
      component = undefined;
     })
    it('should render', () => {
      let component = getComponent();
      expect(component).toMatchSnapshot();
    });
})

Hatte das gleiche Problem. Ich könnte und erwarte, dass Sie es mit der Methode wrapper.instance() beheben können. Auch hier beschrieben https://github.com/react-dnd/react-dnd/issues/488.

z.B

const Context = wrapInTestContext(Component)
const wrapper = mount(<Context />)
const manager = wrapper.instance().getManager()
const backend = manager.getBackend()

Außerdem musste ich die Instanzen der untergeordneten Komponenten dazu bringen, getHandlerId() aufzurufen.

Wenn es hilft, hier eine meiner Testdateien: https://gist.github.com/gilleswittenberg/142fe49e1115b5a1936562b2284e1ab7

Dieses Problem wurde automatisch als veraltet markiert, da es in letzter Zeit keine Aktivität hatte. Es wird geschlossen, wenn keine weitere Aktivität stattfindet. Vielen Dank für Ihre Beiträge.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen