আক্রমণকারী লঙ্ঘন: "সংযুক্ত (স্পোর্টস ডেটাবেস)" এর প্রসঙ্গ বা প্রপসগুলিতে "স্টোর" খুঁজে পাওয়া যায়নি


142

এখানে সম্পূর্ণ কোড: https://gist.github.com/js08/0ec3d70dfda76d7e9fb4

ওহে,

  • আমার একটি অ্যাপ্লিকেশন রয়েছে যেখানে এটি বিল্ড পরিবেশের ভিত্তিতে ডেস্কটপ এবং মোবাইলের জন্য বিভিন্ন টেম্পলেটগুলি দেখায় lates
  • যেখানে আমার মোবাইল টেম্পলেটটির জন্য নেভিগেশন মেনুটি লুকিয়ে রাখতে হবে সেখানে আমি এটি সফলভাবে বিকাশ করতে সক্ষম হয়েছি।
  • এই মুহুর্তে আমি একটি পরীক্ষার কেস লিখতে সক্ষম হয়েছি যেখানে এটি প্রোপাইটিপসের মাধ্যমে সমস্ত মানগুলি নিয়ে আসে এবং সঠিকভাবে রেন্ডার করে
  • তবে ইউনিট পরীক্ষার কেসগুলি কীভাবে লিখতে হবে তা নিশ্চিত নয় যখন তার মোবাইল এটি এনএভি উপাদান সরবরাহ করতে পারে না।
  • আমি চেষ্টা করেছি কিন্তু আমি একটি ত্রুটির মুখোমুখি ... আপনি কীভাবে এটি ঠিক করতে পারবেন আমাকে বলতে পারেন।
  • নীচে প্রোডিং কোড।

পরীক্ষা ক্ষেত্রে

import {expect} from 'chai';
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import {SportsTopPortion} from '../../../src/components/sports-top-portion/sports-top-portion.jsx';
require('../../test-utils/dom');


describe('"sports-top-portion" Unit Tests', function() {
    let shallowRenderer = TestUtils.createRenderer();

    let sportsContentContainerLayout ='mobile';
    let sportsContentContainerProfile = {'exists': 'hasSidebar'};
    let sportsContentContainerAuthExchange = {hasValidAccessToken: true};
    let sportsContentContainerHasValidAccessToken ='test'; 

    it('should render correctly', () => {
        shallowRenderer.render(<SportsTopPortion sportsWholeFramework={sportsContentContainerLayout} sportsPlayers={sportsContentContainerProfile} sportsAuthentication={sportsContentContainerAuthExchange} sportsUpperBar={{activeSportsLink:'test'}} />);
        //shallowRenderer.render(<SportsTopPortion sportsWholeFramework={sportsContentContainerLayout} sportsPlayers={sportsContentContainerProfile} hasValidAccessToken={sportsContentContainerHasValidAccessToken}  />);

        let renderedElement = shallowRenderer.getRenderOutput();
        console.log("renderedElement------->" + JSON.stringify(renderedElement));

        expect(renderedElement).to.exist;
    });

    it('should not render sportsNavigationComponent when sports.build is mobile', () => {
        let sportsNavigationComponent = TestUtils.renderIntoDocument(<SportsTopPortion sportsWholeFramework={sportsContentContainerLayout} sportsPlayers={sportsContentContainerProfile} sportsAuthentication={sportsContentContainerAuthExchange} sportsUpperBar={{activeSportsLink:'test'}} />);
        console.log("sportsNavigationComponent------->" + JSON.stringify(sportsNavigationComponent));

        //let footnoteContainer = TestUtils.findRenderedDOMComponentWithClass(sportsNavigationComponent, 'linkPack--standard');

        //expect(footnoteContainer).to.exist;
    });

});

কোড স্নিপেট যেখানে পরীক্ষার কেস লিখতে হবে

if (sports.build === 'mobile') {
    sportsNavigationComponent = <div />;
    sportsSideMEnu = <div />;
    searchComponent = <div />;
    sportsPlayersWidget = <div />;
}

ত্রুটি

1) "sports-top-portion" Unit Tests should not render sportsNavigationComponent when sports.build is mobile:
     Invariant Violation: Could not find "store" in either the context or props of "Connect(SportsDatabase)". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "Connect(SportsDatabase)".
      at Object.invariant [as default] (C:\sports-whole-page\node_modules\invariant\invariant.js:42:15)
      at new Connect (C:\sports-whole-page\node_modules\react-redux\lib\components\createConnect.js:135:33)
      at [object Object].ReactCompositeComponentMixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactCompositeComponent.js:148:18)
      at [object Object].wrapper [as mountComponent] (C:\sports-whole-page\node_modules\react\lib\ReactPerf.js:66:21)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at ReactDOMComponent.ReactMultiChild.Mixin.mountChildren (C:\sports-whole-page\node_modules\react\lib\ReactMultiChild.js:241:44)
      at ReactDOMComponent.Mixin._createContentMarkup (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:591:32)
      at ReactDOMComponent.Mixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:479:29)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at ReactDOMComponent.ReactMultiChild.Mixin.mountChildren (C:\sports-whole-page\node_modules\react\lib\ReactMultiChild.js:241:44)
      at ReactDOMComponent.Mixin._createContentMarkup (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:591:32)
      at ReactDOMComponent.Mixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:479:29)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at [object Object].ReactCompositeComponentMixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactCompositeComponent.js:225:34)
      at [object Object].wrapper [as mountComponent] (C:\sports-whole-page\node_modules\react\lib\ReactPerf.js:66:21)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at ReactDOMComponent.ReactMultiChild.Mixin.mountChildren (C:\sports-whole-page\node_modules\react\lib\ReactMultiChild.js:241:44)
      at ReactDOMComponent.Mixin._createContentMarkup (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:591:32)
      at ReactDOMComponent.Mixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:479:29)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at [object Object].ReactCompositeComponentMixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactCompositeComponent.js:225:34)
      at [object Object].wrapper [as mountComponent] (C:\sports-whole-page\node_modules\react\lib\ReactPerf.js:66:21)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at ReactDOMComponent.ReactMultiChild.Mixin.mountChildren (C:\sports-whole-page\node_modules\react\lib\ReactMultiChild.js:241:44)
      at ReactDOMComponent.Mixin._createContentMarkup (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:591:32)
      at ReactDOMComponent.Mixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactDOMComponent.js:479:29)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at [object Object].ReactCompositeComponentMixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactCompositeComponent.js:225:34)
      at [object Object].wrapper [as mountComponent] (C:\sports-whole-page\node_modules\react\lib\ReactPerf.js:66:21)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at [object Object].ReactCompositeComponentMixin.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactCompositeComponent.js:225:34)
      at [object Object].wrapper [as mountComponent] (C:\sports-whole-page\node_modules\react\lib\ReactPerf.js:66:21)
      at Object.ReactReconciler.mountComponent (C:\sports-whole-page\node_modules\react\lib\ReactReconciler.js:37:35)
      at mountComponentIntoNode (C:\sports-whole-page\node_modules\react\lib\ReactMount.js:266:32)
      at ReactReconcileTransaction.Mixin.perform (C:\sports-whole-page\node_modules\react\lib\Transaction.js:136:20)
      at batchedMountComponentIntoNode (C:\sports-whole-page\node_modules\react\lib\ReactMount.js:282:15)
      at ReactDefaultBatchingStrategyTransaction.Mixin.perform (C:\sports-whole-page\node_modules\react\lib\Transaction.js:136:20)
      at Object.ReactDefaultBatchingStrategy.batchedUpdates (C:\sports-whole-page\node_modules\react\lib\ReactDefaultBatchingStrategy.js:62:19)
      at Object.batchedUpdates (C:\sports-whole-page\node_modules\react\lib\ReactUpdates.js:94:20)
      at Object.ReactMount._renderNewRootComponent (C:\sports-whole-page\node_modules\react\lib\ReactMount.js:476:18)
      at Object.wrapper [as _renderNewRootComponent] (C:\sports-whole-page\node_modules\react\lib\ReactPerf.js:66:21)
      at Object.ReactMount._renderSubtreeIntoContainer (C:\sports-whole-page\node_modules\react\lib\ReactMount.js:550:32)
      at Object.ReactMount.render (C:\sports-whole-page\node_modules\react\lib\ReactMount.js:570:23)
      at Object.wrapper [as render] (C:\sports-whole-page\node_modules\react\lib\ReactPerf.js:66:21)
      at Object.ReactTestUtils.renderIntoDocument (C:\sports-whole-page\node_modules\react\lib\ReactTestUtils.js:76:21)
      at Context.<anonymous> (C:/codebase/sports-whole-page/test/components/sports-top-portion/sports-top-portion-unit-tests.js:28:41)
      at callFn (C:\sports-whole-page\node_modules\mocha\lib\runnable.js:286:21)
      at Test.Runnable.run (C:\sports-whole-page\node_modules\mocha\lib\runnable.js:279:7)
      at Runner.runTest (C:\sports-whole-page\node_modules\mocha\lib\runner.js:421:10)
      at C:\sports-whole-page\node_modules\mocha\lib\runner.js:528:12
      at next (C:\sports-whole-page\node_modules\mocha\lib\runner.js:341:14)
      at C:\sports-whole-page\node_modules\mocha\lib\runner.js:351:7
      at next (C:\sports-whole-page\node_modules\mocha\lib\runner.js:283:14)
      at Immediate._onImmediate (C:\sports-whole-page\node_modules\mocha\lib\runner.js:319:5)

উত্তর:


182

এটা বেশ সহজ। আপনি কল করে উত্পন্ন মোড়কের উপাদানটি পরীক্ষা করার চেষ্টা করছেন connect()(MyPlainComponent)। এই মোড়কের উপাদানটি একটি রেডাক্স স্টোরটিতে অ্যাক্সেস পাওয়ার আশা করে। সাধারণত যে দোকান হিসাবে পাওয়া যায় context.store, কারণ আপনার উপাদান অনুক্রমের উপরের আপনি একটি আছে চাই <Provider store={myStore} />। তবে আপনি নিজের সংযুক্ত উপাদানটি নিজেই কোনও স্টোর ছাড়াই রেন্ডার করছেন, সুতরাং এটি একটি ত্রুটি ছুঁড়েছে।

আপনি কয়েকটি বিকল্প পেয়েছেন:

  • একটি স্টোর তৈরি করুন এবং <Provider>আপনার সংযুক্ত উপাদানটির চারপাশে একটি রেন্ডার করুন
  • একটি স্টোর তৈরি করুন এবং এটিকে সরাসরি এটিকে পাস করুন <MyConnectedComponent store={store} />, কারণ সংযুক্ত উপাদানটি "স্টোর "টিকে প্রপ হিসাবে গ্রহণ করবে
  • সংযুক্ত উপাদানটি পরীক্ষা করে বিরক্ত করবেন না। "সমতল", সংযোগযুক্ত সংস্করণটি রফতানি করুন এবং এর পরিবর্তে এটি পরীক্ষা করুন। আপনি যদি আপনার সরল উপাদান এবং আপনার mapStateToPropsফাংশন পরীক্ষা করেন তবে আপনি নিরাপদে ধরে নিতে পারেন সংযুক্ত সংস্করণটি সঠিকভাবে কাজ করবে।

আপনি সম্ভবত রেডাক্স ডক্সের "টেস্টিং" পৃষ্ঠাটি পড়তে চান: https://redux.js.org/recips/writing-tests

সম্পাদনা করুন :

আসলে আপনি উত্স পোস্ট করেছেন এবং ত্রুটি বার্তাটি পুনরায় পড়ার পরে, আসল সমস্যাটি স্পোর্টস টপপেন উপাদানটি নয়। সমস্যাটি হ'ল আপনি স্পোর্টস টপপেইনকে "সম্পূর্ণরূপে" রেন্ডার করার চেষ্টা করছেন যা আপনার প্রথম সন্তানের মতো "অগভীর" রেন্ডার না করে তার সমস্ত শিশুকেও সরবরাহ করে। লাইনটি searchComponent = <SportsDatabase sportsWholeFramework="desktop" />;এমন একটি উপাদান উপস্থাপন করছে যা আমি ধরে নিয়েছি যে এটিও সংযুক্ত রয়েছে, এবং তাই প্রত্যাশা করে যে কোনও স্টোর রিয়েটের "প্রসঙ্গ" বৈশিষ্ট্যে পাওয়া যাবে।

এই মুহুর্তে, আপনার কাছে দুটি নতুন বিকল্প রয়েছে:

  • কেবল স্পোর্টস টপপেইনের "অগভীর" উপস্থাপনা করুন, যাতে আপনি এটির শিশুদের পুরোপুরি রেন্ডার করতে বাধ্য করছেন না
  • আপনি যদি স্পোর্টস টপপেইনের "গভীর" রেন্ডারিং করতে চান তবে আপনাকে প্রসঙ্গে একটি রেডাক্স স্টোর সরবরাহ করতে হবে। আমি আপনাকে পরামর্শ দিচ্ছি যে আপনি এনজাইম পরীক্ষার লাইব্রেরিটি একবার দেখুন, যা আপনাকে ঠিক এটি করতে দেয়। উদাহরণের জন্য http://airbnb.io/enzyme/docs/api/ReactWrapper/setContext.html দেখুন ।

সামগ্রিকভাবে, আমি নোট করব যে আপনি এই একটি উপাদানটিতে খুব বেশি চেষ্টা করার চেষ্টা করছেন এবং উপাদান প্রতি কম যুক্তির সাথে এটি ছোট ছোট টুকরো টুকরো করে ভাবার কথা ভাবতে চাইতে পারেন।


আমি চেষ্টা করেছি কিন্তু কীভাবে করব তা নিশ্চিত নই ... আপনি কি আমার পরীক্ষার

1
আমি অভিমানী করছি SportsTopPortion.js, আপনি আছে let SportsTopPortion = connect(mapStateToProps)(SomeOtherComponent)। সবচেয়ে সহজ উত্তরটি হল যে অন্য উপাদানটি পরীক্ষা করা , এটির দ্বারা উপাদানটি ফিরে আসেনি connect
মার্কেরিকসন

1
আহা। এখন আমি কি ঘটছে তা দেখতে পাচ্ছি। সমস্যাটি স্পোর্টস টপপ্যানে নিজেই নয়। সমস্যাটি হ'ল আপনি স্পোর্টস টপপেইনের একটি "পূর্ণ" রেন্ডার করছেন, "অগভীর" রেন্ডার নয়, তাই প্রতিক্রিয়াটি সমস্ত বাচ্চাকে পুরোপুরি রেন্ডার করার চেষ্টা করছে। ত্রুটি বার্তা লাইন বোঝায় searchComponent = <SportsDatabase sportsWholeFramework="desktop" />;যে সংযুক্ত উপাদান করে একটি দোকান এবং অবিচ্ছিন্ন আশা করা হয়। সুতরাং, দুটি নতুন পরামর্শ: হয় কেবল স্পোর্টস টপপেইনের অগভীর রেন্ডারিং করুন, বা পরীক্ষার জন্য এনজাইমের মতো লাইব্রেরি ব্যবহার করুন। Airbnb.io/enzyme/docs/api/ReactWrapper/setContext.html দেখুন ।
মার্কেরিকসন

আপনি কি আমাকে বলতে পারবেন যে এই দৃশ্যের জন্য কীভাবে পরীক্ষার কেস লিখতে হয় - তবে ইউনিট পরীক্ষার কেসগুলি কীভাবে লিখতে হবে তা নিশ্চিত নন যখন তার মোবাইল যখন এটি এনএভি উপাদান সরবরাহ করতে না পারে। `` `

3
"এটি বেশ সহজ" এই বাক্যটি দিয়ে আটকে থাকা বা আশ্চর্যের মধ্যে পড়ে থাকা কাউকে উত্তর দেওয়া অসম্মানজনক বা কঠোর হিসাবে আসতে পারে। অল্প পরিমাণে ব্যবহার করুন।
জায়েকি

97

সম্ভাব্য সমাধান যা উপহাস সহ আমার জন্য কাজ করেছে

import React from "react";
import { shallow } from "enzyme";
import { Provider } from "react-redux";
import configureMockStore from "redux-mock-store";
import TestPage from "../TestPage";

const mockStore = configureMockStore();
const store = mockStore({});

describe("Testpage Component", () => {
    it("should render without throwing an error", () => {
        expect(
            shallow(
                <Provider store={store}>
                    <TestPage />
                </Provider>
            ).exists(<h1>Test page</h1>)
        ).toBe(true);
    });
});

1
একের পর এক প্রপস পাস করার পরিবর্তে ভাল কাজ করে।
ঘোস্টক্রাভিজ

2
আপনাকে ধন্যবাদ একটি খুব সুন্দর সমাধান। আমার এই সমস্যাটি হয়েছিল কারণ আমি রাউটিংয়ের সাথে একটি শীর্ষ-স্তরের অ্যাপ উপাদান ব্যবহার করছি এবং প্রতিটি রুটে চাইল্ড অ্যাপ্লিকেশনটিতে স্টোর সরবরাহ করা হচ্ছে যাতে আমাকে রাউটারের মধ্যে প্রপস পাস করতে না হয়। আমি আমার ব্যবহারের জন্য এটি কিছুটা পরিবর্তন করেছি। কনস্ট র্যাপার = অগভীর (<সরবরাহকারী স্টোর = {স্টোর}> <অ্যাপ /> </ translation>); প্রত্যাশা করুন (wrapper.contains (<অ্যাপ />)).toBe(true);
ছোট মস্তিষ্ক

69

রিডুএক্সের সরকারী দস্তাবেজগুলির পরামর্শ অনুসারে, সংযোগযুক্ত উপাদানটি রফতানি করা আরও ভাল।

ডেকরেটারের সাথে ডিল না করেই অ্যাপ উপাদানটি নিজেই পরীক্ষা করতে সক্ষম হওয়ার জন্য, আমরা আপনাকে অনিদ্রিত উপাদান রফতানি করার পরামর্শ দিই:

import { connect } from 'react-redux'

// Use named export for unconnected component (for tests)
export class App extends Component { /* ... */ }
// Use default export for the connected component (for app)
export default connect(mapStateToProps)(App)

যেহেতু ডিফল্ট রফতানি এখনও সজ্জিত উপাদান, তাই উপরে চিত্রিত আমদানি বিবৃতি আগের মতো কাজ করবে যাতে আপনার অ্যাপ্লিকেশন কোড পরিবর্তন করতে হবে না। তবে, আপনি এখন আপনার পরীক্ষার ফাইলে অদৃশ্য অ্যাপ অ্যাপ্লিকেশনগুলি আমদানি করতে পারেন:

// Note the curly braces: grab the named export instead of default export
import { App } from './App'

এবং যদি আপনার উভয়ের প্রয়োজন হয়:

import ConnectedApp, { App } from './App'

অ্যাপটিতে নিজেই, আপনি এখনও এটিকে সাধারণভাবে আমদানি করবেন:

import App from './App'

আপনি কেবল পরীক্ষার জন্য নামযুক্ত রফতানিটি ব্যবহার করবেন।


1
এই উত্তরটিও বৈধ। অ্যাঙ্করটি মিলানোর জন্য আপনার লিঙ্কটি সম্পাদনা করেছে।
ইরোলিন

এই উত্তরটি নিখুঁত করে তোলে! এটি সব ক্ষেত্রে সঠিক জিনিস নাও হতে পারে তবে সরবরাহকারীর সাথে খেলার চেয়ে অবশ্যই এটি ভাল এবং যখন এটি প্রয়োজন হয় না।
lokori

ধন্যবাদ @ লাকোরি আপনাকে খুশি!
বিশাল গুলতি

2
আমার পরীক্ষাটি আবার পাস করার জন্য এটি ছিল সবচেয়ে দ্রুত এবং সহজতম উপায়।
মাইক লিয়নস 21

2
"আপনি কেবল পরীক্ষার জন্য নামযুক্ত রফতানিটি ব্যবহার করবেন" " -- আমার জন্য কাজ কর.
টেকনিকাজি

7

যখন আমরা একসাথে একটি প্রতিক্রিয়া-রিডাক্স অ্যাপ্লিকেশন রাখি তখন আমাদের এমন একটি কাঠামো দেখার আশা করা উচিত যেখানে শীর্ষে আমাদের কাছে Providerট্যাগ থাকে যেখানে একটি রিডুক্স স্টোরের উদাহরণ রয়েছে।

সেই Providerট্যাগটি তারপরে আপনার পিতামাতার উপাদানটিকে Appরেন্ডার করে, সেই উপাদানটিকে কল করতে দেয় যা পরিবর্তে অ্যাপ্লিকেশনের অভ্যন্তরে প্রতিটি উপাদানকে রেন্ডার করে।

এখানে মূল অংশটি হ'ল, যখন আমরা connect()ফাংশনটির সাথে কোনও উপাদান আবৃত করি , সেই connect()ফাংশনটি হায়ারার্কির মধ্যে কিছু প্যারেন্ট উপাদান দেখতে আশা করে Provider

সুতরাং আপনি যে connect()ফাংশনটি সেখানে রেখেছেন , এটি শ্রেণিবিন্যাসটি সন্ধান করবে এবং এটি সন্ধান করার চেষ্টা করবে Provider

আপনি যা করতে চান তা ঠিক তা কিন্তু আপনার পরীক্ষার পরিবেশে সেই প্রবাহটি ভেঙে যাচ্ছে।

কেন?

কেন?

আমরা যখন ধরে নেওয়া স্পোর্টস ডেটাবেস টেস্ট ফাইলটিতে ফিরে যাই তখন আপনাকে অবশ্যই স্পোর্টস ডেটাবেস উপাদান হতে হবে এবং তারপরে সেই উপাদানটি বিচ্ছিন্নভাবে রেন্ডার করার চেষ্টা করতে হবে।

সুতরাং মূলত আপনি যে পরীক্ষার ফাইলটির মধ্যে যা করছেন তা কেবল সেই উপাদানটি গ্রহণ করছে এবং কেবল এটি বুনোতে ফেলে দিচ্ছে Providerএবং এর কোনওর সাথে বা এর উপরে কোনও স্টোর নেই এবং আপনি কেন এই বার্তাটি দেখছেন তা নিশ্চিত।

Providerসেই উপাদানটির প্রসঙ্গে বা প্রোপগুলিতে স্টোর বা ট্যাগ নেই এবং তাই উপাদানটি একটি ত্রুটি নিক্ষেপ করে কারণ এটি Providerতার পৈতৃক শ্রেণিবিন্যাসে একটি ট্যাগ বা সঞ্চয় দেখতে চায় ।

সুতরাং যে ত্রুটি মানে কি।


6

আমার ক্ষেত্রে ঠিক

const myReducers = combineReducers({
  user: UserReducer
});

const store: any = createStore(
  myReducers,
  applyMiddleware(thunk)
);

shallow(<Login />, { context: { store } });


2

এই আমদানিটি "এনজাইম" থেকে {অগভীর, মাউন্ট do করুন;

const store = mockStore({
  startup: { complete: false }
});

describe("==== Testing App ======", () => {
  const setUpFn = props => {
    return mount(
      <Provider store={store}>
        <App />
      </Provider>
    );
  };

  let wrapper;
  beforeEach(() => {
    wrapper = setUpFn();
  });

2

আমার জন্য এটি আমদানি ইস্যু ছিল, আশা করি এটি সাহায্য করবে। ওয়েবস্টোরমের দ্বারা ডিফল্ট আমদানি ভুল ছিল।

প্রতিস্থাপন করা

import connect from "react-redux/lib/connect/connect";

সঙ্গে

import {connect} from "react-redux";

1

আমি আপগ্রেড করার সময় আমার সাথে এটি ঘটেছিল। আমাকে পিছনে ডাউনগ্রেড করতে হয়েছিল।

প্রতিক্রিয়া-রিডাক্স ^ 5.0.6 → .1 7.1.3


এটি
asnwer

অনেক ব্রেকিং পরিবর্তন ছিল। Youtube.com/watch?v=yOZ4Ml9LlWE
কামিল জাজিনিসজেসকি

0

আপনার ইনডেক্স.জেএস এর শেষে এই কোডটি যুক্ত করতে হবে:

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter  } from 'react-router-dom';

import './index.css';
import App from './App';

import { Provider } from 'react-redux';
import { createStore, applyMiddleware, compose, combineReducers } from 'redux';
import thunk from 'redux-thunk';

///its your redux ex
import productReducer from './redux/reducer/admin/product/produt.reducer.js'

const rootReducer = combineReducers({
    adminProduct: productReducer
   
})
const composeEnhancers = window._REDUX_DEVTOOLS_EXTENSION_COMPOSE_ || compose;
const store = createStore(rootReducer, composeEnhancers(applyMiddleware(thunk)));


const app = (
    <Provider store={store}>
        <BrowserRouter   basename='/'>
            <App />
        </BrowserRouter >
    </Provider>
);
ReactDOM.render(app, document.getElementById('root'));

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.