Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React 16 upgrade #1116

Merged
merged 41 commits into from
Feb 16, 2018
Merged
Show file tree
Hide file tree
Changes from 33 commits
Commits
Show all changes
41 commits
Select commit Hold shift + click to select a range
bbce3f9
upgrade react context menu to v2.9
Dec 28, 2017
6ff153f
Merge branch 'master' into ql-context-menu-upgrade
Jan 15, 2018
874819f
add unit tests
Jan 16, 2018
c9f0e55
update unit test
Jan 16, 2018
c792018
remove unecessary id set
Jan 19, 2018
5045270
remove unnecessary function
Jan 22, 2018
19c825d
update migration doc
Jan 22, 2018
c82e21a
catchup master
Jan 31, 2018
82a0020
Merge branch 'ql-context-menu-upgrade' into am-react-16
amanmahajan7 Feb 6, 2018
656f3cb
Upgrade dependencies
amanmahajan7 Feb 6, 2018
12d2c11
Fix example list on the home page
amanmahajan7 Feb 6, 2018
239e7bc
Fix Navbar URL
amanmahajan7 Feb 7, 2018
2449ad1
Remove react-addons-perf
amanmahajan7 Feb 7, 2018
502c456
Delete separate documentation and example page. A single page is now …
amanmahajan7 Feb 7, 2018
b0adbfe
Update peer dependencies
amanmahajan7 Feb 7, 2018
5422d43
Upgrade enzyme to 3.x
amanmahajan7 Feb 7, 2018
7ad6892
Remove examples and documentation entries
amanmahajan7 Feb 7, 2018
acca333
Upgrade jasmine-enzyme to the latest version
amanmahajan7 Feb 7, 2018
743b357
Upgrade react-input-autosize to the latest version
amanmahajan7 Feb 7, 2018
a210eaf
Cleanup navigation links
amanmahajan7 Feb 7, 2018
b1b9005
Fix unit tests
amanmahajan7 Feb 7, 2018
0b8da0b
Do not use private node prop
amanmahajan7 Feb 7, 2018
cbe9bf8
Fix more unit tests
amanmahajan7 Feb 7, 2018
c9d1764
Upgrade react-select to the latest version
amanmahajan7 Feb 8, 2018
8a85e67
Remove explicit react-input-autosize dependency
amanmahajan7 Feb 8, 2018
5c4782b
update react-dnd
amanmahajan7 Feb 8, 2018
f66c8d3
Fix component docs
amanmahajan7 Feb 8, 2018
c108d39
Fix invalid markup
amanmahajan7 Feb 8, 2018
7f4a2a2
Resolve conflicts after next catchup
amanmahajan7 Feb 8, 2018
ed78e6e
Deleted performance tests as react-addons-perf is no longer supported
amanmahajan7 Feb 8, 2018
a1b9c6a
Cleanup routes and fix key warnings
amanmahajan7 Feb 8, 2018
475a4ac
Fix unit tests - find cell again after each operation as caching does…
amanmahajan7 Feb 9, 2018
431316b
Temporarily disable failing test
amanmahajan7 Feb 9, 2018
50af34d
Remove unsupported exact prop
amanmahajan7 Feb 9, 2018
0a2be3a
Use minified react scripts
amanmahajan7 Feb 9, 2018
d8dedd8
Use path prop to create nested routes
amanmahajan7 Feb 9, 2018
a94e2aa
Removed incorrect test
amanmahajan7 Feb 12, 2018
8016c00
Remove unused imports
amanmahajan7 Feb 12, 2018
3c75949
Use keymirror package instead of fbjs/lib/keyMirror
amanmahajan7 Feb 14, 2018
a4b3c87
Use shallowequal package instead of fbjs/lib/shallowEqual
amanmahajan7 Feb 14, 2018
305367b
Add html5DragDropContext to initilize HTML5Backend only once
amanmahajan7 Feb 16, 2018
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 20 additions & 0 deletions .editorconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# http://editorconfig.org

root = true

[*]

# Change these settings to your own preference
indent_style = space
indent_size = 2

# We recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false
5 changes: 1 addition & 4 deletions config/webpack.config.prod.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,7 @@ const config = {
'react-data-grid-addons/dist/react-data-grid-addons': ['./packages/react-data-grid-addons/src'],
'react-data-grid/dist/react-data-grid.min': ['./packages/react-data-grid/src'],
'react-data-grid-addons/dist/react-data-grid-addons.min': ['./packages/react-data-grid-addons/src'],
'react-data-grid-examples/dist/shared': './packages/react-data-grid-examples/src/shared.js',
'react-data-grid-examples/dist/examples': './packages/react-data-grid-examples/src/examples.js',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A single index page is now being used instead of three separate pages (index, examples, and documentation)

'react-data-grid-examples/dist/index': './packages/react-data-grid-examples/src/index.js',
'react-data-grid-examples/dist/documentation': './packages/react-data-grid-examples/src/documentation.js'
'react-data-grid-examples/dist/index': './packages/react-data-grid-examples/src'
},
output: {
path: './packages',
Expand Down
30 changes: 14 additions & 16 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,21 +23,20 @@
"react-component"
],
"peerDependencies": {
"react": "^15.6.2",
"react-dom": "^15.6.2"
"react": "^15.0.0 || ^16.0.0",
"react-dom": "^15.0.0 || ^16.0.0"
},
"dependencies": {
"classnames": "^1.2.0",
"classnames": "^2.2.5",
"es5-shim": "^4.0.3",
"fbjs": "^0.6.1",
"fs-extra": "^0.30.0",
"object-assign": "^2.0.0",
"object-assign": "^4.1.1",
"prop-types": "^15.5.10",
"react-contextmenu": "^2.9.2",
"react-dnd": "^2.1.4",
"react-dnd-html5-backend": "^2.1.2",
"react-input-autosize": "1.1.0",
"react-select": "^1.0.0-beta14",
"react-dnd": "^2.5.4",
"react-dnd-html5-backend": "^2.5.4",
"react-select": "^1.2.1",
"reselect": "^2.5.1",
"ron-react-autocomplete": "^4.0.5"
},
Expand All @@ -57,7 +56,8 @@
"copy-dir": "^0.3.0",
"css-loader": "^0.26.0",
"del": "^1.2.1",
"enzyme": "^2.9.1",
"enzyme": "^3.3.0",
"enzyme-adapter-react-16": "^1.1.1",
"eslint": "^1.10.3",
"eslint-loader": "^1.2.0",
"eslint-plugin-react": "^3.15.0",
Expand All @@ -69,7 +69,7 @@
"immutable": "^3.7.3",
"istanbul-instrumenter-loader": "^0.1.2",
"jasmine-core": "2.6.1",
"jasmine-enzyme": "^1.2.0",
"jasmine-enzyme": "^4.2.0",
"karma": "^1.1.0",
"karma-chrome-launcher": "^0.2.0",
"karma-coverage": "^0.4.0",
Expand All @@ -88,14 +88,12 @@
"mkdirp": "^0.5.1",
"moment": "^2.10.6",
"node-dir": "^0.1.12",
"object-assign": "^2.1.1",
"open": "0.0.5",
"react": "^15.6.2",
"react-addons-perf": "^15.4.2",
"react-dnd-test-backend": "^1.0.2",
"react": "^16.2.0",
"react-dnd-test-backend": "^2.5.4",
"react-docgen": "^2.8.2",
"react-dom": "^15.6.2",
"react-test-renderer": "^15.6.2",
"react-dom": "^16.2.0",
"react-test-renderer": "^16.2.0",
"rewire": "^2.1.3",
"rewire-webpack": "^1.0.0",
"run-sequence": "^1.2.2",
Expand Down
48 changes: 24 additions & 24 deletions packages/react-data-grid-addons/src/__tests__/Grid.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@ describe('Grid', function() {
};

this.componentWrapper = this.createComponent();
this.component = this.componentWrapper.node;
this.component = this.componentWrapper.instance();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

node is a private property and an error is thrown in V3

});

it('should create a new instance of Grid', function() {
Expand All @@ -109,7 +109,7 @@ describe('Grid', function() {
describe('for defaults props', function() {
beforeEach(function() {
const ToolBarStub = new StubComponent('Toolbar');
this.component = this.createComponent({ toolbar: <ToolBarStub /> }).node;
this.component = this.createComponent({ toolbar: <ToolBarStub /> }).instance();
this.toolbarInstance = TestUtils.findRenderedComponentWithType(this.component, ToolBarStub);
this.toolbarInstance.props.onToggleFilter();
this.baseGrid = this.getBaseGrid();
Expand All @@ -131,7 +131,7 @@ describe('Grid', function() {
describe('for a given row height prop', function() {
beforeEach(function() {
const ToolBarStub = new StubComponent('Toolbar');
this.component = this.createComponent({ toolbar: <ToolBarStub />, rowHeight: 40 }).node;
this.component = this.createComponent({ toolbar: <ToolBarStub />, rowHeight: 40 }).instance();
this.toolbarInstance = TestUtils.findRenderedComponentWithType(this.component, ToolBarStub);
this.toolbarInstance.props.onToggleFilter();
this.baseGrid = this.getBaseGrid();
Expand All @@ -153,7 +153,7 @@ describe('Grid', function() {
describe('for given row and header height props', function() {
beforeEach(function() {
const ToolBarStub = new StubComponent('Toolbar');
this.component = this.createComponent({ toolbar: <ToolBarStub />, rowHeight: 40, headerRowHeight: 50, headerFiltersHeight: 60 }).node;
this.component = this.createComponent({ toolbar: <ToolBarStub />, rowHeight: 40, headerRowHeight: 50, headerFiltersHeight: 60 }).instance();
this.toolbarInstance = TestUtils.findRenderedComponentWithType(this.component, ToolBarStub);
this.toolbarInstance.props.onToggleFilter();
this.baseGrid = this.getBaseGrid();
Expand All @@ -176,7 +176,7 @@ describe('Grid', function() {
describe('if passed in as props to grid', function() {
beforeEach(function() {
const ToolBarStub = new StubComponent('Toolbar');
this.component = this.createComponent({ toolbar: <ToolBarStub /> }).node;
this.component = this.createComponent({ toolbar: <ToolBarStub /> }).instance();
this.toolbarInstance = TestUtils.findRenderedComponentWithType(this.component, ToolBarStub);
});

Expand Down Expand Up @@ -207,7 +207,7 @@ describe('Grid', function() {
rowGetter: this.rowGetter,
rowsCount: this._rows.length,
width: 300
}).node;
}).instance();
});

it('grid should be initialized with selected state of {rowIdx : -1, idx : -1}', function() {
Expand All @@ -217,7 +217,7 @@ describe('Grid', function() {

describe('When row selection enabled', function() {
beforeEach(function() {
this.component = this.createComponent({ enableRowSelect: true}).node;
this.component = this.createComponent({ enableRowSelect: true}).instance();
this.baseGrid = this.getBaseGrid();
this.selectRowCol = this.baseGrid.props.columnMetrics.columns[0];
});
Expand Down Expand Up @@ -302,7 +302,7 @@ describe('Grid', function() {
describe('Cell Navigation', function() {
describe('when cell navigation is configured to default, none', function() {
beforeEach(function() {
this.component = this.createComponent({enableCellSelect: true}).node;
this.component = this.createComponent({enableCellSelect: true}).instance();
});

describe('when on last cell in a row', function() {
Expand Down Expand Up @@ -336,7 +336,7 @@ describe('Grid', function() {

describe('when cell navigation is configured to change rows', function() {
beforeEach(function() {
this.component = this.createComponent({cellNavigationMode: 'changeRow', enableCellSelect: true}).node;
this.component = this.createComponent({cellNavigationMode: 'changeRow', enableCellSelect: true}).instance();
});

describe('when on last cell in a row that\'s not the last', function() {
Expand Down Expand Up @@ -388,7 +388,7 @@ describe('Grid', function() {

describe('when cell navigation is configured to loop over cells in row', function() {
beforeEach(function() {
this.component = this.createComponent({cellNavigationMode: 'loopOverRow', enableCellSelect: true}).node;
this.component = this.createComponent({cellNavigationMode: 'loopOverRow', enableCellSelect: true}).instance();
});

describe('when on last cell, looping enabled', function() {
Expand Down Expand Up @@ -445,7 +445,7 @@ describe('Grid', function() {
const extraProps = { onCellSelected: this.noop, onCellDeSelected: this.noop };
spyOn(extraProps, 'onCellSelected');
spyOn(extraProps, 'onCellDeSelected');
this.component = this.createComponent(extraProps).node;
this.component = this.createComponent(extraProps).instance();
});

describe('cell is selected', function() {
Expand Down Expand Up @@ -489,7 +489,7 @@ describe('Grid', function() {
onRowsDeselected: function(deselectedRows) {
self._deselectedRows = deselectedRows;
}
}}).node;
}}).instance();
this.baseGrid = this.getBaseGrid();
this.selectRowCol = this.baseGrid.props.columnMetrics.columns[0];
});
Expand Down Expand Up @@ -550,7 +550,7 @@ describe('Grid', function() {
onRowsDeselected: function(deselectedRows) {
self._deselectedRows = deselectedRows;
}
}}).node;
}}).instance();

this.baseGrid = this.getBaseGrid();
this.selectRowCol = this.baseGrid.props.columnMetrics.columns[0];
Expand Down Expand Up @@ -587,7 +587,7 @@ describe('Grid', function() {
onRowsDeselected: function(deselectedRows) {
self._deselectedRows = deselectedRows;
}
}}).node;
}}).instance();

this.baseGrid = this.getBaseGrid();
this.selectRowCol = this.baseGrid.props.columnMetrics.columns[0];
Expand Down Expand Up @@ -656,7 +656,7 @@ describe('Grid', function() {
beforeEach(function() {
const editableColumn = Object.assign({ editable: true }, this.columns[1]);
this.columns[1] = editableColumn;
this.component = this.createComponent({ columns: this.columns }).node;
this.component = this.createComponent({ columns: this.columns }).instance();
});

describe('copy a cell value', function() {
Expand All @@ -679,7 +679,7 @@ describe('Grid', function() {
const vCharacterKeyCode = 118;
spyOn(this.testProps, 'onCellCopyPaste');
wrapper.setProps({ onCellCopyPaste: this.testProps.onCellCopyPaste });
this.component = wrapper.node;
this.component = wrapper.instance();
this.component.setState({
textToCopy: 'banana',
selected: { idx: 1, rowIdx: 5 },
Expand Down Expand Up @@ -801,7 +801,7 @@ describe('Grid', function() {
let wrapper = this.createComponent();
spyOn(this.testProps, 'onCellsDragged');
wrapper.setProps({ onCellsDragged: this.testProps.onCellsDragged });
this.component = wrapper.node;
this.component = wrapper.instance();
this.component.setState({
selected: { idx: 1, rowIdx: 2 },
dragged: { idx: 1, rowIdx: 2, value: 'apple', overRowIdx: 6 }
Expand Down Expand Up @@ -834,7 +834,7 @@ describe('Grid', function() {
const newColumns = Object.assign([], this.columns);
newColumns.splice(2, 0, newColumn);
wrapper.setProps({ columns: newColumns });
this.component = wrapper.node;
this.component = wrapper.instance();
this.columns = this.component.state.columnMetrics.columns;
});

Expand All @@ -853,7 +853,7 @@ describe('Grid', function() {
const newColumns = Object.assign([], this.columns);
newColumns.splice(1, 1);
wrapper.setProps({ columns: newColumns });
this.component = wrapper.node;
this.component = wrapper.instance();
this.columns = this.component.state.columnMetrics.columns;
});

Expand Down Expand Up @@ -921,7 +921,7 @@ describe('Grid', function() {
let wrapper = this.createComponent();
spyOn(this.testProps, 'onRowUpdated');
wrapper.setProps({ onRowUpdated: this.testProps.onRowUpdated });
this.component = wrapper.node;
this.component = wrapper.instance();
this.component.setState({ selected: { idx: 3, rowIdx: 3, active: true } });
this.getCellMetaData().onCommit(this.buildFakeCellUodate());
});
Expand Down Expand Up @@ -1007,7 +1007,7 @@ describe('Grid', function() {
const editableColumn = Object.assign({ editable: true }, this.columns[0]);
this.columns[0] = editableColumn;
wrapper.setProps({ columns: this.columns });
this.component = wrapper.node;
this.component = wrapper.instance();
});

it('should keep original metric information', function() {
Expand All @@ -1025,7 +1025,7 @@ describe('Grid', function() {

beforeEach(function() {
wrapper = this.createComponent();
this.component = wrapper.node;
this.component = wrapper.instance();
this.tableElement = ReactDOM.findDOMNode(this.component);
});

Expand All @@ -1036,7 +1036,7 @@ describe('Grid', function() {
describe('providing table width as prop', function() {
beforeEach(function() {
wrapper.setProps({ minWidth: 900 });
this.component = wrapper.node;
this.component = wrapper.instance();
});

it('should set the width of the table', function() {
Expand All @@ -1060,7 +1060,7 @@ describe('Grid', function() {
this.component = this.createComponent({rowsCount: this.rows.length, rowGetter: rowGetter, columns: columns, onRowClick: function(rowIdx, row, column) {
self.rowClicked = {row, column};
self.rowClicks++;
}}).node;
}}).instance();
});

it('calls handler when row (cell) clicked', function() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ describe('<DropTargetRowContainer />', () => {
beforeEach(() => {
ComponentUnderTest = wrapInTestContext(dropTargetRowContainer(fakeRow));
wrapper = mount(<ComponentUnderTest {...props} />);
manager = wrapper.node.getManager();
manager = wrapper.instance().getManager();
backend = manager.getBackend();
registry = manager.getRegistry();
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,8 +39,8 @@ describe('ContainerEditorWrapper', () => {
const renderedComp = Enzyme.mount(<ConnectedContainerEditorWrapper />);

// ASSERT
let redneredContainerEditorWrapper = renderedComp.find('ContainerEditorWrapper').node;
let renderedFakeComponent = renderedComp.find('FakeComponent').node;
let redneredContainerEditorWrapper = renderedComp.find('ContainerEditorWrapper').instance();
let renderedFakeComponent = renderedComp.find('FakeComponent').instance();
redneredContainerEditorWrapper.getValue();

expect(renderedComp).toBeDefined();
Expand All @@ -55,8 +55,8 @@ describe('ContainerEditorWrapper', () => {
const renderedComp = Enzyme.mount(<ConnectedContainerEditorWrapper />);

// ASSERT
let redneredContainerEditorWrapper = renderedComp.find('ContainerEditorWrapper').node;
let renderedFakeComponent = renderedComp.find('FakeComponent').node;
let redneredContainerEditorWrapper = renderedComp.find('ContainerEditorWrapper').instance();
let renderedFakeComponent = renderedComp.find('FakeComponent').instance();
redneredContainerEditorWrapper.getInputNode();

expect(renderedComp).toBeDefined();
Expand Down
4 changes: 2 additions & 2 deletions packages/react-data-grid-examples/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -19,14 +19,14 @@
"dependencies": {
"immutability-helper": "^2.4.0",
"react-data-grid": "^3.0.11",
"react-data-grid-addons": "^3.0.11"
"react-data-grid-addons": "^3.0.11",
"react-router-dom": "^4.2.2"
},
"devDependencies": {
"bootstrap": "^3.2.0",
"jquery": "^2.1.1",
"lodash": "^4.13.1",
"lodash.groupby": "^4.5.1",
"react-router": "^0.13.3",
"markdown": "^0.5.0"
}
}
Loading