From 994038d60cacf827c189629a44abf00b3e07ace2 Mon Sep 17 00:00:00 2001 From: Ron Buckton Date: Thu, 15 Nov 2018 15:21:20 -0800 Subject: [PATCH 1/4] Remove node dependencies from react --- types/react-dom/server/index.d.ts | 8 +++++++- types/react/test/index.ts | 17 +++++++++++++++++ 2 files changed, 24 insertions(+), 1 deletion(-) diff --git a/types/react-dom/server/index.d.ts b/types/react-dom/server/index.d.ts index 53bbca7250..ef42606717 100644 --- a/types/react-dom/server/index.d.ts +++ b/types/react-dom/server/index.d.ts @@ -1,4 +1,10 @@ -/// +// forward declarations +declare global { + namespace NodeJS { + // tslint:disable-next-line:no-empty-interface + interface ReadableStream {} + } +} import { ReactElement } from 'react'; diff --git a/types/react/test/index.ts b/types/react/test/index.ts index 97d61118b9..0b747edd66 100644 --- a/types/react/test/index.ts +++ b/types/react/test/index.ts @@ -14,6 +14,23 @@ import update = require("react-addons-update"); import createReactClass = require("create-react-class"); import * as DOM from "react-dom-factories"; +// forward declarations (avoids an unnecessary dependency on NodeJS) +declare global { + interface Console { + log(message?: any, ...optionalParams: any[]): void; + } + var console: Console; + + function setInterval(callback: (...args: any[]) => void, ms: number, ...args: any[]): NodeJS.Timeout; + function clearInterval(intervalId: NodeJS.Timeout): void; + + namespace NodeJS { + // tslint:disable-next-line:no-empty-interface + interface Timer {} + interface Timeout extends Timer {} + } +} + interface Props extends React.Attributes { hello: string; world?: string | null; From f961f35307f3c2e2d085dde65fc46484efd2150d Mon Sep 17 00:00:00 2001 From: Ron Buckton Date: Fri, 16 Nov 2018 12:48:36 -0800 Subject: [PATCH 2/4] Remove node dependencies from react --- types/react/test/index.ts | 46 ++++++++++++----------------------- types/react/v15/test/index.ts | 29 ++++++++++++---------- 2 files changed, 32 insertions(+), 43 deletions(-) diff --git a/types/react/test/index.ts b/types/react/test/index.ts index 0b747edd66..672de32b37 100644 --- a/types/react/test/index.ts +++ b/types/react/test/index.ts @@ -14,23 +14,6 @@ import update = require("react-addons-update"); import createReactClass = require("create-react-class"); import * as DOM from "react-dom-factories"; -// forward declarations (avoids an unnecessary dependency on NodeJS) -declare global { - interface Console { - log(message?: any, ...optionalParams: any[]): void; - } - var console: Console; - - function setInterval(callback: (...args: any[]) => void, ms: number, ...args: any[]): NodeJS.Timeout; - function clearInterval(intervalId: NodeJS.Timeout): void; - - namespace NodeJS { - // tslint:disable-next-line:no-empty-interface - interface Timer {} - interface Timeout extends Timer {} - } -} - interface Props extends React.Attributes { hello: string; world?: string | null; @@ -103,7 +86,7 @@ declare const container: Element; render() { return null; } componentDidMount() { // $ExpectError -> this will be true in next BC release where state is gonna be `null | Readonly` - console.log(this.state.inputValue); + this.state.inputValue; } mutateState() { // $ExpectError @@ -184,7 +167,7 @@ class ModernComponent extends React.Component value: this.state.inputValue ? this.state.inputValue : undefined }), DOM.input({ - onChange: event => console.log(event.target) + onChange: event => event.target })); } @@ -518,17 +501,20 @@ class Timer extends React.Component<{}, TimerState> { state = { secondsElapsed: 0 }; - private _interval: NodeJS.Timer; + // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes + // private _interval: NodeJS.Timer; tick() { this.setState((prevState, props) => ({ secondsElapsed: prevState.secondsElapsed + 1 })); } componentDidMount() { - this._interval = setInterval(() => this.tick(), 1000); + // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes + // this._interval = setInterval(() => this.tick(), 1000); } componentWillUnmount() { - clearInterval(this._interval); + // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes + // clearInterval(this._interval); } render() { return DOM.div( @@ -615,14 +601,14 @@ Perf.printExclusive(); Perf.printWasted(); Perf.printOperations(); -console.log(Perf.getExclusive()); -console.log(Perf.getInclusive()); -console.log(Perf.getWasted()); -console.log(Perf.getOperations()); -console.log(Perf.getExclusive(measurements)); -console.log(Perf.getInclusive(measurements)); -console.log(Perf.getWasted(measurements)); -console.log(Perf.getOperations(measurements)); +Perf.getExclusive(); +Perf.getInclusive(); +Perf.getWasted(); +Perf.getOperations(); +Perf.getExclusive(measurements); +Perf.getInclusive(measurements); +Perf.getWasted(measurements); +Perf.getOperations(measurements); // Renamed to printOperations(). Please use it instead. Perf.printDOM(measurements); diff --git a/types/react/v15/test/index.ts b/types/react/v15/test/index.ts index 30dd3bd75d..42ca5999a8 100644 --- a/types/react/v15/test/index.ts +++ b/types/react/v15/test/index.ts @@ -120,7 +120,7 @@ class ModernComponent extends React.Component value: this.state.inputValue }), React.DOM.input({ - onChange: event => console.log(event.target) + onChange: event => event.target })); } @@ -342,7 +342,7 @@ const htmlAttr: React.HTMLProps = { event.stopPropagation(); }, onAnimationStart: event => { - console.log(event.currentTarget.className); + event.currentTarget.className; }, dangerouslySetInnerHTML: { __html: "STRONG" @@ -505,17 +505,20 @@ class Timer extends React.Component<{}, TimerState> { state = { secondsElapsed: 0 }; - private _interval: NodeJS.Timer; + // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes + // private _interval: NodeJS.Timer; tick() { this.setState((prevState, props) => ({ secondsElapsed: prevState.secondsElapsed + 1 })); } componentDidMount() { - this._interval = setInterval(() => this.tick(), 1000); + // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes + // this._interval = setInterval(() => this.tick(), 1000); } componentWillUnmount() { - clearInterval(this._interval); + // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes + // clearInterval(this._interval); } render() { return React.DOM.div( @@ -602,14 +605,14 @@ Perf.printExclusive(); Perf.printWasted(); Perf.printOperations(); -console.log(Perf.getExclusive()); -console.log(Perf.getInclusive()); -console.log(Perf.getWasted()); -console.log(Perf.getOperations()); -console.log(Perf.getExclusive(measurements)); -console.log(Perf.getInclusive(measurements)); -console.log(Perf.getWasted(measurements)); -console.log(Perf.getOperations(measurements)); +Perf.getExclusive(); +Perf.getInclusive(); +Perf.getWasted(); +Perf.getOperations(); +Perf.getExclusive(measurements); +Perf.getInclusive(measurements); +Perf.getWasted(measurements); +Perf.getOperations(measurements); // Renamed to printOperations(). Please use it instead. Perf.printDOM(measurements); From 48eba801e2af7ea945f8f4cd06d247b2890889ac Mon Sep 17 00:00:00 2001 From: Ron Buckton Date: Fri, 16 Nov 2018 14:17:11 -0800 Subject: [PATCH 3/4] Fix lint errors due to new lint rules --- types/meteor/test/globals/meteor-tests.ts | 16 ++++++++-------- types/meteor/test/meteor-tests.ts | 16 ++++++++-------- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/types/meteor/test/globals/meteor-tests.ts b/types/meteor/test/globals/meteor-tests.ts index 782701086f..e3a3e750bb 100644 --- a/types/meteor/test/globals/meteor-tests.ts +++ b/types/meteor/test/globals/meteor-tests.ts @@ -371,19 +371,19 @@ Comments.find({ viewNumber: { $gt: 100 } }); Comments.find({ viewNumber: { $not: { $lt: 100, $gt: 1000 } } }); Comments.find({ tags: { $in: [ "tag-1", "tag-2", "tag-3" ] } }); Comments.find({ $or: [ { text: "hello" }, { text: "world" } ] }); -Comments.find({ $or: [ - { text: "hello" }, - { text: "world", viewNumber: { $gt: 0 } } +Comments.find({ $or: [ + { text: "hello" }, + { text: "world", viewNumber: { $gt: 0 } } ], authorId: "test-author-id" }); -Comments.find({ $and: [ - { $or: [{ authorId: "author-id-1" }, { authorId: "author-id-2" }] }, +Comments.find({ $and: [ + { $or: [{ authorId: "author-id-1" }, { authorId: "author-id-2" }] }, { $or: [{ tags: "tag-1" }, { tags: "tag-2" }] } ]}); Comments.find({ $query: {inlineLinks: { $exists: true, $type: "array" } } }); -Comments.find({ inlineLinks: { $elemMatch: { - objectType: InlineObjectType.Image, - objectUrl: { $regex: "https://(www\.?)youtube\.com" } +Comments.find({ inlineLinks: { $elemMatch: { + objectType: InlineObjectType.Image, + objectUrl: { $regex: "https://(www\.?)youtube\.com" } } } }); Comments.find({ "inlineLinks.objectType": InlineObjectType.Person }); Comments.find({ tags: "tag-1" }); diff --git a/types/meteor/test/meteor-tests.ts b/types/meteor/test/meteor-tests.ts index b45284df52..63f83ef79d 100644 --- a/types/meteor/test/meteor-tests.ts +++ b/types/meteor/test/meteor-tests.ts @@ -383,19 +383,19 @@ Comments.find({ viewNumber: { $gt: 100 } }); Comments.find({ viewNumber: { $not: { $lt: 100, $gt: 1000 } } }); Comments.find({ tags: { $in: [ "tag-1", "tag-2", "tag-3" ] } }); Comments.find({ $or: [ { text: "hello" }, { text: "world" } ] }); -Comments.find({ $or: [ - { text: "hello" }, - { text: "world", viewNumber: { $gt: 0 } } +Comments.find({ $or: [ + { text: "hello" }, + { text: "world", viewNumber: { $gt: 0 } } ], authorId: "test-author-id" }); -Comments.find({ $and: [ - { $or: [{ authorId: "author-id-1" }, { authorId: "author-id-2" }] }, +Comments.find({ $and: [ + { $or: [{ authorId: "author-id-1" }, { authorId: "author-id-2" }] }, { $or: [{ tags: "tag-1" }, { tags: "tag-2" }] } ]}); Comments.find({ $query: { inlineLinks: { $exists: true, $type: "array" } } }); -Comments.find({ inlineLinks: { $elemMatch: { - objectType: InlineObjectType.Image, - objectUrl: { $regex: "https://(www\.?)youtube\.com" } +Comments.find({ inlineLinks: { $elemMatch: { + objectType: InlineObjectType.Image, + objectUrl: { $regex: "https://(www\.?)youtube\.com" } } } }); Comments.find({ "inlineLinks.objectType": InlineObjectType.Person }); Comments.find({ tags: "tag-1" }); From f8a87d07b3253029c217f25002f3ff4e8f05a1a8 Mon Sep 17 00:00:00 2001 From: Ron Buckton Date: Tue, 27 Nov 2018 11:24:21 -0800 Subject: [PATCH 4/4] Address PR feedback --- types/react/test/index.ts | 37 ++++++++++++++++++++--------------- types/react/v15/test/index.ts | 37 ++++++++++++++++++++--------------- 2 files changed, 42 insertions(+), 32 deletions(-) diff --git a/types/react/test/index.ts b/types/react/test/index.ts index 672de32b37..8a4a2bd89b 100644 --- a/types/react/test/index.ts +++ b/types/react/test/index.ts @@ -14,6 +14,14 @@ import update = require("react-addons-update"); import createReactClass = require("create-react-class"); import * as DOM from "react-dom-factories"; +// NOTE: forward declarations for tests +declare function setInterval(...args: any[]): any; +declare function clearInterval(...args: any[]): any; +declare var console: Console; +interface Console { + log(...args: any[]): void; +} + interface Props extends React.Attributes { hello: string; world?: string | null; @@ -86,7 +94,7 @@ declare const container: Element; render() { return null; } componentDidMount() { // $ExpectError -> this will be true in next BC release where state is gonna be `null | Readonly` - this.state.inputValue; + console.log(this.state.inputValue); } mutateState() { // $ExpectError @@ -167,7 +175,7 @@ class ModernComponent extends React.Component value: this.state.inputValue ? this.state.inputValue : undefined }), DOM.input({ - onChange: event => event.target + onChange: event => console.log(event.target) })); } @@ -501,20 +509,17 @@ class Timer extends React.Component<{}, TimerState> { state = { secondsElapsed: 0 }; - // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes - // private _interval: NodeJS.Timer; + private _interval: number; tick() { this.setState((prevState, props) => ({ secondsElapsed: prevState.secondsElapsed + 1 })); } componentDidMount() { - // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes - // this._interval = setInterval(() => this.tick(), 1000); + this._interval = setInterval(() => this.tick(), 1000); } componentWillUnmount() { - // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes - // clearInterval(this._interval); + clearInterval(this._interval); } render() { return DOM.div( @@ -601,14 +606,14 @@ Perf.printExclusive(); Perf.printWasted(); Perf.printOperations(); -Perf.getExclusive(); -Perf.getInclusive(); -Perf.getWasted(); -Perf.getOperations(); -Perf.getExclusive(measurements); -Perf.getInclusive(measurements); -Perf.getWasted(measurements); -Perf.getOperations(measurements); +console.log(Perf.getExclusive()); +console.log(Perf.getInclusive()); +console.log(Perf.getWasted()); +console.log(Perf.getOperations()); +console.log(Perf.getExclusive(measurements)); +console.log(Perf.getInclusive(measurements)); +console.log(Perf.getWasted(measurements)); +console.log(Perf.getOperations(measurements)); // Renamed to printOperations(). Please use it instead. Perf.printDOM(measurements); diff --git a/types/react/v15/test/index.ts b/types/react/v15/test/index.ts index 42ca5999a8..79d05ac8d0 100644 --- a/types/react/v15/test/index.ts +++ b/types/react/v15/test/index.ts @@ -11,6 +11,14 @@ import * as TestUtils from "react-addons-test-utils"; import TransitionGroup = require("react-addons-transition-group"); import update = require("react-addons-update"); +// NOTE: forward declarations for tests +declare function setInterval(...args: any[]): any; +declare function clearInterval(...args: any[]): any; +declare var console: Console; +interface Console { + log(...args: any[]): void; +} + interface Props extends React.Attributes { hello: string; world?: string; @@ -120,7 +128,7 @@ class ModernComponent extends React.Component value: this.state.inputValue }), React.DOM.input({ - onChange: event => event.target + onChange: event => console.log(event.target) })); } @@ -342,7 +350,7 @@ const htmlAttr: React.HTMLProps = { event.stopPropagation(); }, onAnimationStart: event => { - event.currentTarget.className; + console.log(event.currentTarget.className); }, dangerouslySetInnerHTML: { __html: "STRONG" @@ -505,20 +513,17 @@ class Timer extends React.Component<{}, TimerState> { state = { secondsElapsed: 0 }; - // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes - // private _interval: NodeJS.Timer; + private _interval: number; tick() { this.setState((prevState, props) => ({ secondsElapsed: prevState.secondsElapsed + 1 })); } componentDidMount() { - // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes - // this._interval = setInterval(() => this.tick(), 1000); + this._interval = setInterval(() => this.tick(), 1000); } componentWillUnmount() { - // NOTE: creates unnecessary dependency on 'node'. leaving for reference purposes - // clearInterval(this._interval); + clearInterval(this._interval); } render() { return React.DOM.div( @@ -605,14 +610,14 @@ Perf.printExclusive(); Perf.printWasted(); Perf.printOperations(); -Perf.getExclusive(); -Perf.getInclusive(); -Perf.getWasted(); -Perf.getOperations(); -Perf.getExclusive(measurements); -Perf.getInclusive(measurements); -Perf.getWasted(measurements); -Perf.getOperations(measurements); +console.log(Perf.getExclusive()); +console.log(Perf.getInclusive()); +console.log(Perf.getWasted()); +console.log(Perf.getOperations()); +console.log(Perf.getExclusive(measurements)); +console.log(Perf.getInclusive(measurements)); +console.log(Perf.getWasted(measurements)); +console.log(Perf.getOperations(measurements)); // Renamed to printOperations(). Please use it instead. Perf.printDOM(measurements);