Reflux.Store.state is inaccessible on v6.4.1

[hololoev]

Hey guys. First of all sorry me if it's stupid issue. I'm just going to migrate from native flux to reflux.

So, when I'm trying to create store, I have an error: "Reflux.Store.state is inaccessible before the store has been initialized."

I can reproduce this bug only on v6.4.1. On 6.3.0, 5.0.4 - there is no problem.

Code is very simple:

const React = require('react');
const Reflux = require('reflux');

class MyStore extends Reflux.Store {
}

module.exports = MyStore;

I do something wrong?

[micheltobon]

you need to create your state in the constructor function of your Reflux.Store

class MyStore extends Reflux.store{ constructor(){ this.state = {myProp : 'myValue'}; } }

[stereodenis]

es6 syntax not working for me

[vladimir-konnov]

I have the same problem with v.6.4.1. As long as I access the store I get this error "Reflux.Store.state is inaccessible before the store has been initialized.". It happens when I assign a store in the reflux component (coffeescript syntax)

class MyComponent extends Reflux.Component
  constructor: (props) ->
    super(props)
    @state = {}
    @store = require('./store') <--- here

In the stacktrace after this line there's get ... <--exception here extend ... (aninymous) ... {this_very_call} ... In v.6.3.0 everything works fine.

store:

class MyStore extends Reflux.Store
  constructor: ->
    super
    @state = {}

module.exports = Reflux.initStore(MyStore)

[hololoev]

stereodenis, ES6 syntax works properly on previous versions, mb without "import" directive, or something else, but with 90% other features (I use browserify & reactify with --es6).

micheltobon, it not works. This: https://gist.github.com/hololoev/da3a0d577bd355a3cf2ca50b7746d687 is minimal code example to reproduce error.

[micheltobon]

1: You don't need to import React into Actions.js nor in Store.js, you are not using it 2: in index.js you are not importing ReactDom. 3: I am going to assume that line 35 goes before line 33

[vladimir-konnov]

@micheltobon In the example provided above I bet there's an error in line 41, when requiring/importing store class

[micheltobon]

Also there is a problem, @hololoev you are never calling any of your declared actions whatsoever, you have to create a callback function in your store for each one of the actions that you want to be listening to,

In your example you only declared ONE action: testAction

Therefore in your store you must declare a function called onTestAction

And then you can call your testAction action from anywhere in your codebase like this: Actions.testAction();

The other error that I see in your code (even though the lines are commented) are in lines 51 and 55: You are trying to call actions that were not declared in your actions, which will cause an error because basically those two elements are undefined and will break your javascript in execution time.

[hololoev]

micheltobon, sorry, it was bad example. You are right about mistakes. So I made 100% work example:

Work code: http://reflux-work.itcdon.ru/ src: http://reflux-work.itcdon.ru/work.tar.gz

Error code: http://reflux-fail.itcdon.ru/ src: http://reflux-fail.itcdon.ru/fail.tar.gz

There is the only one difference - reflux version. For work example it's - 6.3.0, for error example is - 6.4.1.

[micheltobon]

I am glad you solved your problem, I think this issue can be closed now

[vladimir-konnov]

@micheltobon the issue cannot be closed, because the problem is still there. Every time one requires a store in a component class, he gets "Reflux.Store.state is inaccessible before the store has been initialized." error in v.6.4.1. Please investigate and solve it (if you are on the reflux team). The examples provided above give you all the necessary information to do it.

[BryanGrezeszak]

Unfortunately I cannot get the examples given to reproduce the error.

For example, I did my best runnable interpretation of the gist that hololoev made at a jsfiddle here, but it works fine without any visible errors.

I believe you that you're having the issue, but unfortunately we cannot fix that which we cannot reproduce. Code examples in the format of just describing "this file this code, that file that code" are actually not always super helpful, because that's not runnable code, but rather a vague description of a project setup that doesn't actually include a lot of the data about how the project is set up (e.g. how is the JSX being transpiled? Is it running node or are those requires being transpiled together? if so via what system? what versions of each lib involved are being used? ...sometimes the issue lies in those details). Sometimes that type of description is enough...but sometimes it's not.

In some cases the person with the problem truly is the only person that can make a viable running example of the problem...so we need you to do that. That means either something like a codepen/jsfiddle that actually causes the errors, or if too complex for that then a legit example project of the error that can be pulled/npm install/npm start type thing. Sometimes that's the only way to actually get the developers to be able to reproduce your problem, and this seems to be one of those times because I'm doing as accurate of interpretations of the code you're posting as I can, and the error is simply not coming up in them.

So I'm closing this, simply because it's old anyway and already includes a bunch of posts that haven't gotten us closer, so if we're gonna fix it we might as well doing it as a fresh issue with repeatable examples of the error when the time comes. So if we can get a viable reproduction of the error then I welcome it being posted as a new issue.