Verwendung von react-test-renderer mit <Switch> Ursachen "Stateless-Funktionskomponenten können keine Referenzen erhalten" Warnung

Question

Ich benutze React-Test-Renderer (16.0.0-Beta.5), um Snapshot-Tests auf einer benutzerdefinierten React Native-Komponente durchzuführen. Diese Komponente enthält eine Schalterkomponente, die diese Warnung verursacht während der Testausführung geworfen werden:

console.error node_modules \ FBJS \ lib \ warning.js: 36

Warnung: Stateless Funktionskomponenten kann nicht gegeben werden Ref. Versuche, auf diese Referenz zuzugreifen, schlagen fehl.

Überprüfen Sie die Rendermethode Switch. in Unknown (durch Schalter erstellt) in Schalter

Minimal-Code zu reproduzieren:

import React from 'react'; 
import renderer from 'react-test-renderer'; 
import { Switch } from 'react-native'; 

test('renders correctly',() => { 
    const tree = renderer.create(
    <Switch /> 
); 
}); 

etwas detaillierter: Die von der nativen RCTSwitch Komponente von Switch.render verwendete verursacht wird:

return (
    <RCTSwitch 
    {...props} 
    ref={(ref) => { this._rctSwitch = ref; }} 
    onChange={this._onChange} 
    /> 
); 

Wie Sie sehen können, ist dieser Komponente eine Referenz zugewiesen. reagieren jedoch Test-Renderer verwendet den folgenden Code zu überprüfen, ob eine Komponente staatenlos ist:

if (typeof value === 'object' && value !== null && typeof value.render === 'function') { 
    // Proceed under the assumption that this is a class instance 

Da RCTSwitch keine Render-Methode haben, die Warnung ausgelöst wird. Ist das ein Fehler?

Answer 1

Stateless-Komponenten unterstützen keine Referenzen, erstellen eine zustandsbehaftete Komponente.

Für weitere Einzelheiten siehe this Antwort

Answer 2

I jest.mock('Switch') zum Test gegeben und jetzt geht es.

Beachten Sie, dass dies die Switch-Komponente aus dem Snapshot entfernt, aber da es keinen Grund gibt, eine reine react-native Komponente zu testen, ist es in Ordnung, solange alle Funktionen des Switch separat getestet werden.