jquense / bill Goto Github PK
View Code? Open in Web Editor NEWcss selector engine for React elements and components
css selector engine for React elements and components
I'm using your teaspoon package to shallowRender my components for testing, and for some reason, I'm getting this error (from bill) when trying to call find on it:
TypeError: Cannot read property 'displayName' of undefined
Strangely, it only happens with one of my components, and I'm not sure why.
I've created a gist with the code that's giving me issues.
Edit: Forgot to mention on node v5.0.0
I'm attempting to update react-transition-group to react 16 but there's several tests failing with errors from within this library with "TypeError: _utils.getInstanceFromNode is not a function"
FAIL test/CSSTransition-test.js
● CSSTransition › should flush new props to the DOM before initiating a transition
TypeError: _utils.getInstanceFromNode is not a function
at normalizeSubject (node_modules/bill/node.js:57:57)
at createNode (node_modules/bill/node.js:118:13)
at NodeCollection (node_modules/teaspoon/index.js:49:44)
at Object.<anonymous> (test/CSSTransition-test.js:17:28)
at Promise (<anonymous>)
at Promise.resolve.then.el (node_modules/p-map/index.js:42:16)
at <anonymous>
For reference my branch is here: https://github.com/Graham42/react-transition-group/tree/react-16
I.e. does it work with the component tree's meant for serialization/snapshots:
import renderer from 'react-test-renderer'
import { querySelectorAll } from 'bill'
const tree = renderer.create(<div />).toJSON()
const matches = querySelectorAll('div', tree)
import ReactTestUtils from 'react-addons-test-utils'
import { querySelectorAll } from 'bill'
const renderer = ReactTestUtils.createRenderer()
renderer.render(<div />)
const tree = renderer.getRenderOutput()
const matches = querySelectorAll('div', tree)
The reason I ask is because you may have already created a component instance with renderer.create()
which continues to stay reactively "alive" responding to state changes, and then you want to traverse its component tree, not the original component tree you first passed to renderer.create()
.
I'd like to add *Bill` to this library of mine:
https://github.com/faceyspacey/jest-redux-snap
So, for example, will bill be able to work with renderer.create(<div />).toJSON()
?
I see the following error when running karma + teaspoon tests under phantomjs. I'm using react v0.14.8. Bill @ v3.2.2 & Teaspoon v6.3.0. The top message is just a warning and the bottom one is fatal but they both cropped up at the same time; I'm struggling to track down the source of the actual error but I suspect they may be related.
WARNING in ./~/bill/utils.js
Module not found: Error: Cannot resolve module 'react/lib/ReactDOMComponentTree' in /Users/thom/dev/voltserver/ops/client/node_modules/bill
@ ./~/bill/utils.js 18:26-68
08 04 2016 21:00:33.476:WARN [karma]: No captured browser, open http://localhost:9876/
08 04 2016 21:00:33.482:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
08 04 2016 21:00:33.491:INFO [launcher]: Starting browser PhantomJS
08 04 2016 21:00:34.275:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#x5ikoTDwSQyhfF5iAAAA with id 88681715
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
ReferenceError: Strict mode forbids implicit creation of global property 'isPrimitive'
I was playing with teaspoon and was generating some React code that had a few buttons, each with a different id. I thought that button#a
would get the button with id="a"
and button#b
would get the button with id="b"
, but both of those selectors kept returning both buttons.
After RTFM, I realized that the #id
selector wasn't yet implemented.
Obviously, you probably intend to implement this. But for principle of least surprise, I'd rather it kick out an error for unsupported and/or invalid selectors. Or at least the documentation contain bolded a note that #id selectors weren't yet implemented, because I'm somewhat assuming that real front-end devs (I'm not one :) ) use #id selectors a decent amount of the time.
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.