teropa / redux-voting-client Goto Github PK
View Code? Open in Web Editor NEWClient app for the Full-Stack Redux Tutorial
Home Page: http://teropa.info/blog/2015/09/10/full-stack-redux-tutorial.html
Client app for the Full-Stack Redux Tutorial
Home Page: http://teropa.info/blog/2015/09/10/full-stack-redux-tutorial.html
Hi ,
When i run npm run test in voting-client the tests are failing.
I didn't fork the project. I followed the blog and built the project and the versions are different and hence the error.
Here are the versions i have in my package.json
"devDependencies": {
"chai": "^3.4.1",
"chai-immutable": "^1.5.3",
"immutable": "^3.7.6",
"jsdom": "^3.1.2",
"mocha": "^2.3.4",
"react-hot-loader": "^1.3.0",
"webpack": "^1.12.9",
"webpack-dev-server": "^1.14.0"
},
"dependencies": {
"immutable": "^3.7.6",
"react": "^0.14.5",
"react-addons-test-utils": "^0.14.5",
"react-dom": "^0.14.5"
}
Also one more thing i noticed is
We have the following in Vote.jsx (in the blog this was in Voting.jsx before the following is moved to Vote.jsx)
<button key={entry}
className={classNames({voted: this.hasVotedFor(entry)})}
disabled={this.isDisabled()}
onClick={() => this.props.vote(entry)}>
And there is no vote() function !! and how come this worked ?? I am getting the error
TypeError: string is not a function
at onClick (Voting.jsx:12:49)
at Object.invokeGuardedCallback as invokeGuardedCallbackWithCatch
As some one posted in other issue i am using react-addons-test-utils as i got the deprecated error with react/addons
Thanks
it('renders as a pure component', () => {
const pair = ['Trainspotting', '28 Days Later'];
const component = renderIntoDocument(
<Voting pair={pair} />
);
let firstButton = scryRenderedDOMComponentsWithTag(component, 'button')[0];
expect(firstButton.textContent).to.equal('Trainspotting');
pair[0] = 'Sunshine';
const component2 = renderIntoDocument(
<Voting pair={pair} />
);
firstButton = scryRenderedDOMComponentsWithTag(component2, 'button')[0];
expect(firstButton.textContent).to.equal('Trainspotting');
});
at least in my test, expect(firstButton.textContent).to.equal('Sunshine');
I guess here we should use a immuatable list
Would you consider licensing this with some OSS-license of your choosing? Being a total beginner with Redux this seems like it could be a nice starting point for frontend apps.
Seriously awesome tutorial anyway, big kudos for that! ๐
when I run "npm run test" I get the following error
'jsx)'' is not recognized as an internal or external command, operable program or batch file.
I changed extensions to js and removed the quotes from the glob pattern and it is working. But, not sure, if this is with problem with node version or OS.
mocha --compilers js:babel-core/register --require ./test/test_helper.js test/**/*.js
Node version is 4.2.1
OS is Windows 7 Professional
Warning: setProps(...) and replaceProps(...) are deprecated. Instead, call render again at the top level.
The Voting_spec.js
test uses component.setProps({pair: pair});
which is deprecated, ideas for alternatives?
Hi,
I was following the tutorial and got a dependencies error for react/addons running tests.
It seems to be deprecated on react 0.14.2.
I fixed it replacing the "react/addons" on React import on tests:
import React from 'react/dist/react-with-addons';
Thank you for this tutorial, it have been very helpful.
reducer_spec.js fails in browser (karma) testing...the problem is in the chai equality testing on iterables...Map...my fix is to use chai-immutable, which (I guess) was originally intended (as shown in package.json) but not implemented for whatever reason...
Maybe there's some other way to configure karma to make it work, but it appears it is more straightforward to use chai-immutable instead...
tks for the awesome article.D:
when i run the
React and react-hot-loader
the console show error
ERROR in ./src/index.jsx
Module build failed: Error: React Hot Loader: The Webpack loader is now exported separately. If you use Babel, we recommend that you remove "react-hot-loader" from the "loaders" section of your Webpack configuration altogether, and instead add "react-hot-loader/babel" to the "plugins" section of your .babelrc file. If you prefer not to use Babel, replace "react-hot-loader" or "react-hot" with "react-hot-loader/webpack" in the "loaders" section of your Webpack configuration.
and I use the solution Hot Reloading your React App to solve the problem.
It seems using the location global is not allowed so when you use it to set variables in your socket.io configuration at
src/index.jsx, const socket = io(${location.protocol}//${location.hostname}:8090
);
react simply won't load the page. I got around this by just typing in my protocol and hostname,
const socket = io(${window.location.protocol}//${window.location.hostname}:8090
);
Not sure if this will have any bad side effects though.
Thanks for this awesome tutorial by the way!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.