From 22e192a4b57dd70414eaf30932c31250f04b1a6b Mon Sep 17 00:00:00 2001 From: Jason Quense Date: Fri, 8 Apr 2016 10:01:56 -0400 Subject: [PATCH] [added] react 15 support --- karma.conf.js | 1 + lib/package.json | 2 +- package.json | 19 ++++++++++--------- src/utils.js | 19 +++++++++++++------ test/common.js | 2 +- test/dom.js | 13 +++++++++++-- 6 files changed, 37 insertions(+), 19 deletions(-) diff --git a/karma.conf.js b/karma.conf.js index 7696744..8941ff3 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -29,6 +29,7 @@ module.exports = function (config) { }, webpack: { + devtool: 'inline-source-map', module: { loaders: [{ test: /\.js$/, loader: 'babel', exclude: /node_modules/ }] } diff --git a/lib/package.json b/lib/package.json index eb1172e..a30f94b 100644 --- a/lib/package.json +++ b/lib/package.json @@ -28,7 +28,7 @@ "invariant": "^2.2.0", "lodash": "^3.10.1", "promise": "^7.1.1", - "react-addons-test-utils": "^0.14.0-rc1", + "react-addons-test-utils": "^0.14.0-rc1 || ^15.0", "warning": "^2.1.0" } } diff --git a/package.json b/package.json index 4a6525f..aba0eeb 100644 --- a/package.json +++ b/package.json @@ -4,9 +4,13 @@ "description": "jQuery-esque Api for React elements and instances, supports complex css selectors", "main": "lib/index.js", "scripts": { - "test": "karma start --single-run", + "test": "npm run react:14 && npm run test-current && npm run react:15 && npm run test-current", + "test-current": "karma start --single-run", "tdd": "karma start", "toc": "doctoc README.md --github", + "react:clean": "rimraf node_modules/react node_modules/react-dom node_modules/react-addons-test-utils", + "react:14": "npm run react:clean && npm i react@0.14 react-dom@0.14 react-addons-test-utils@0.14", + "react:15": "npm run react:clean && npm i react@15 react-dom@15 react-addons-test-utils@15", "build": "babel src --out-dir lib && npm run toc && cpy ./README.md ./lib", "release": "release" }, @@ -26,8 +30,8 @@ }, "homepage": "https://github.com/jquense/teaspoon", "peerDependencies": { - "react": "^0.14.0-rc1", - "react-dom": "^0.14.0-rc1" + "react": "^0.14.0-rc1 || ^15.0.0", + "react-dom": "^0.14.0-rc1 || ^15.0.0" }, "devDependencies": { "babel": "^5.8.25", @@ -52,24 +56,21 @@ "karma-webpack": "^1.7.0", "mocha": "^2.3.3", "mt-changelog": "^0.6.2", - "react": "^0.14.3", - "react-dom": "^0.14.0-rc1", - "release-script": "^0.5.3", + "release-script": "^1.0.2", "sinon": "^1.17.1", "sinon-chai": "^2.8.0", "webpack": "^1.12.2" }, "dependencies": { - "bill": "^3.1.0", + "bill": "^3.2.1", "dom-helpers": "^2.4.0", "invariant": "^2.2.0", "lodash": "^3.10.1", "promise": "^7.1.1", - "react-addons-test-utils": "^0.14.0-rc1", + "react-addons-test-utils": "^0.14.0-rc1 || ^15.0", "warning": "^2.1.0" }, "release-script": { - "defaultDryRun": "false", "altPkgRootFolder": "lib" } } diff --git a/src/utils.js b/src/utils.js index 8122d4d..21c50b9 100644 --- a/src/utils.js +++ b/src/utils.js @@ -7,6 +7,7 @@ import ReactTestUtils from'react-addons-test-utils'; import invariant from 'invariant'; import bill from 'bill'; +import { ifDef } from 'bill/compat'; import { createNode, NODE_TYPES } from 'bill/node'; export let isDOMComponent = ReactTestUtils.isDOMComponent; @@ -62,7 +63,7 @@ export function render(element, mount, { props, context }, renderFn) { if (!renderInstance) renderInstance = instance - + if (instance === null) { renderInstance = null; wrapper = wrapElement(element, null, prevWrapper) @@ -175,11 +176,17 @@ export function wrapElement(element, context, prevWrapper) { return {element} } - -export function getMountPoint(instance){ - var id = getID(findDOMNode(instance)); - return findReactContainerForID(id); -} +export let getMountPoint = ifDef({ + '<15': function getMountPoint(instance) { + var id = getID(findDOMNode(instance)); + return findReactContainerForID(id); + }, + '*': function getMountPoint(instance) { + let privInst = createNode(instance).privateInstance + let container = createNode(privInst._nativeContainerInfo._topLevelWrapper) + return findDOMNode(container.instance).parentNode + } +}) export function getRootInstance(mountPoint){ return _instancesByReactRootID[getReactRootID(mountPoint)]; diff --git a/test/common.js b/test/common.js index 2ae6080..f2d0126 100644 --- a/test/common.js +++ b/test/common.js @@ -182,7 +182,7 @@ describe('common', ()=> { inst.is(Stateless).should.equal(true) }) - it.only('.end()', () => { + it('.end()', () => { render() .find(Stateless) .find('strong') diff --git a/test/dom.js b/test/dom.js index c7f95ef..585828c 100644 --- a/test/dom.js +++ b/test/dom.js @@ -1,5 +1,5 @@ import React from 'react'; -import { render } from 'react-dom'; +import { render, findDOMNode } from 'react-dom'; import $ from '../src'; describe('DOM rendering specific', ()=> { @@ -36,13 +36,22 @@ describe('DOM rendering specific', ()=> { } it('should wrap existing mounted component', ()=> { + class Div extends React.Component { + render(){ return
} + } let mount = document.createElement('div') - , instance = render(
, mount) + , instance = render(
, mount) let $inst = $(instance); expect($inst[0]).to.equal(instance); expect($inst._mountPoint).to.equal(mount) + + let span = findDOMNode(instance).children[0]; + $inst = $(span); + + expect($inst[0]).to.equal(span); + expect($inst._mountPoint).to.equal(mount) }) it('should unmount', ()=> {