From 7d711a37058c924d7017f9e4d801bcf8b47b9be4 Mon Sep 17 00:00:00 2001 From: Luis Merino Date: Wed, 30 May 2018 16:43:17 +0200 Subject: [PATCH 1/2] Fix test sequence shared by two types of history Both Browser and History shares the first step of the ReplaceChangesTheKey sequence. The expectation to match the key prop is different for Memory since it creates a first initial entry which contains a value other than undefined. Checking if entries is part of the returned history objects is now used to distinguish one history object type from another and write a working expecation match object. --- modules/__tests__/RenderTestSequences/ReplaceChangesTheKey.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/modules/__tests__/RenderTestSequences/ReplaceChangesTheKey.js b/modules/__tests__/RenderTestSequences/ReplaceChangesTheKey.js index 73ecb05..9ab81bd 100644 --- a/modules/__tests__/RenderTestSequences/ReplaceChangesTheKey.js +++ b/modules/__tests__/RenderTestSequences/ReplaceChangesTheKey.js @@ -7,10 +7,10 @@ export default (done) => { let keyAfterPush const steps = [ - ({ location }) => { + ({ location, entries }) => { expect(location).toMatch({ pathname: '/', - key: undefined + key: entries ? /^[0-9a-z]+$/ : undefined }) return From 0a68f3c4216679fa21044102dd78fadf9ee22d9d Mon Sep 17 00:00:00 2001 From: Luis Merino Date: Wed, 30 May 2018 16:49:29 +0200 Subject: [PATCH 2/2] Fix eslint erroring files with semi colons --- modules/Actions.js | 38 ++++++++++++++++++-------------------- modules/BrowserHistory.js | 28 ++++++++++++++-------------- modules/HashHistory.js | 28 ++++++++++++++-------------- modules/MemoryHistory.js | 28 ++++++++++++++-------------- modules/Prompt.js | 32 ++++++++++++++++---------------- modules/PropTypes.js | 8 ++++---- modules/index.js | 10 +++++----- 7 files changed, 85 insertions(+), 87 deletions(-) diff --git a/modules/Actions.js b/modules/Actions.js index c9f7b37..a7c66b4 100644 --- a/modules/Actions.js +++ b/modules/Actions.js @@ -1,36 +1,36 @@ -import React from "react"; -import PropTypes from "prop-types"; -import { history as historyType } from "./PropTypes"; +import React from "react" +import PropTypes from "prop-types" +import { history as historyType } from "./PropTypes" class Action extends React.Component { static propTypes = { perform: PropTypes.func.isRequired - }; + } static contextTypes = { history: historyType.isRequired - }; + } performAction() { - this.props.perform(this.context.history); + this.props.perform(this.context.history) } componentDidMount() { - this.performAction(); + this.performAction() } componentDidUpdate() { - this.performAction(); + this.performAction() } render() { - return null; + return null } } export const Push = ({ location, path, state }) => ( history.push(location || path, state)} /> -); +) Push.propTypes = { path: PropTypes.string, @@ -41,26 +41,24 @@ Push.propTypes = { hash: PropTypes.string, state: PropTypes.object }) -}; +} export const Replace = ({ location, path, state }) => ( history.replace(location || path, state)} /> -); +) -Replace.propTypes = Push.propTypes; +Replace.propTypes = Push.propTypes -export const Pop = ({ go }) => history.go(go)} />; +export const Pop = ({ go }) => history.go(go)} /> Pop.propTypes = { go: PropTypes.number -}; +} Pop.defaultProps = { go: -1 -}; +} -export const Back = () => history.goBack()} />; +export const Back = () => history.goBack()} /> -export const Forward = () => ( - history.goForward()} /> -); +export const Forward = () => history.goForward()} /> diff --git a/modules/BrowserHistory.js b/modules/BrowserHistory.js index 5af0450..ac5b904 100644 --- a/modules/BrowserHistory.js +++ b/modules/BrowserHistory.js @@ -1,7 +1,7 @@ -import React from "react"; -import PropTypes from "prop-types"; -import createBrowserHistory from "history/createBrowserHistory"; -import { history as historyType } from "./PropTypes"; +import React from "react" +import PropTypes from "prop-types" +import createBrowserHistory from "history/createBrowserHistory" +import { history as historyType } from "./PropTypes" /** * Manages session history using the HTML5 history API including @@ -14,14 +14,14 @@ class BrowserHistory extends React.Component { getUserConfirmation: PropTypes.func, keyLength: PropTypes.number, children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired - }; + } static childContextTypes = { history: historyType.isRequired - }; + } getChildContext() { - return { history: this.history }; + return { history: this.history } } componentWillMount() { @@ -30,30 +30,30 @@ class BrowserHistory extends React.Component { forceRefresh, getUserConfirmation, keyLength - } = this.props; + } = this.props this.history = createBrowserHistory({ basename, forceRefresh, getUserConfirmation, keyLength - }); + }) // Do this here so we catch actions in cDM. - this.unlisten = this.history.listen(() => this.forceUpdate()); + this.unlisten = this.history.listen(() => this.forceUpdate()) } componentWillUnmount() { - this.unlisten(); + this.unlisten() } render() { - const { children } = this.props; + const { children } = this.props return typeof children === "function" ? children(this.history) - : React.Children.only(children); + : React.Children.only(children) } } -export default BrowserHistory; +export default BrowserHistory diff --git a/modules/HashHistory.js b/modules/HashHistory.js index 80b882a..0d53213 100644 --- a/modules/HashHistory.js +++ b/modules/HashHistory.js @@ -1,7 +1,7 @@ -import React from "react"; -import PropTypes from "prop-types"; -import createHashHistory from "history/createHashHistory"; -import { history as historyType } from "./PropTypes"; +import React from "react" +import PropTypes from "prop-types" +import createHashHistory from "history/createHashHistory" +import { history as historyType } from "./PropTypes" /** * Manages session history using window.location.hash. @@ -12,40 +12,40 @@ class HashHistory extends React.Component { getUserConfirmation: PropTypes.func, hashType: PropTypes.oneOf(["hashbang", "noslash", "slash"]), children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired - }; + } static childContextTypes = { history: historyType.isRequired - }; + } getChildContext() { - return { history: this.history }; + return { history: this.history } } componentWillMount() { - const { basename, getUserConfirmation, hashType } = this.props; + const { basename, getUserConfirmation, hashType } = this.props this.history = createHashHistory({ basename, getUserConfirmation, hashType - }); + }) // Do this here so we catch actions in cDM. - this.unlisten = this.history.listen(() => this.forceUpdate()); + this.unlisten = this.history.listen(() => this.forceUpdate()) } componentWillUnmount() { - this.unlisten(); + this.unlisten() } render() { - const { children } = this.props; + const { children } = this.props return typeof children === "function" ? children(this.history) - : React.Children.only(children); + : React.Children.only(children) } } -export default HashHistory; +export default HashHistory diff --git a/modules/MemoryHistory.js b/modules/MemoryHistory.js index 88e7d64..c708208 100644 --- a/modules/MemoryHistory.js +++ b/modules/MemoryHistory.js @@ -1,7 +1,7 @@ -import React from "react"; -import PropTypes from "prop-types"; -import createMemoryHistory from "history/createMemoryHistory"; -import { history as historyType } from "./PropTypes"; +import React from "react" +import PropTypes from "prop-types" +import createMemoryHistory from "history/createMemoryHistory" +import { history as historyType } from "./PropTypes" /** * Manages session history using in-memory storage. @@ -13,14 +13,14 @@ class MemoryHistory extends React.Component { initialIndex: PropTypes.number, keyLength: PropTypes.number, children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired - }; + } static childContextTypes = { history: historyType.isRequired - }; + } getChildContext() { - return { history: this.history }; + return { history: this.history } } componentWillMount() { @@ -29,30 +29,30 @@ class MemoryHistory extends React.Component { initialEntries, initialIndex, keyLength - } = this.props; + } = this.props this.history = createMemoryHistory({ getUserConfirmation, initialEntries, initialIndex, keyLength - }); + }) // Do this here so we catch actions in cDM. - this.unlisten = this.history.listen(() => this.forceUpdate()); + this.unlisten = this.history.listen(() => this.forceUpdate()) } componentWillUnmount() { - this.unlisten(); + this.unlisten() } render() { - const { children } = this.props; + const { children } = this.props return typeof children === "function" ? children(this.history) - : React.Children.only(children); + : React.Children.only(children) } } -export default MemoryHistory; +export default MemoryHistory diff --git a/modules/Prompt.js b/modules/Prompt.js index 8de3c12..cf8773a 100644 --- a/modules/Prompt.js +++ b/modules/Prompt.js @@ -1,54 +1,54 @@ -import React from "react"; -import PropTypes from "prop-types"; -import { history as historyType } from "./PropTypes"; +import React from "react" +import PropTypes from "prop-types" +import { history as historyType } from "./PropTypes" class Prompt extends React.Component { static propTypes = { when: PropTypes.bool, message: PropTypes.oneOfType([PropTypes.func, PropTypes.string]).isRequired - }; + } static contextTypes = { history: historyType.isRequired - }; + } static defaultProps = { when: true - }; + } enable(message) { - if (this.unblock) this.unblock(); + if (this.unblock) this.unblock() - this.unblock = this.context.history.block(message); + this.unblock = this.context.history.block(message) } disable() { if (this.unblock) { - this.unblock(); - this.unblock = null; + this.unblock() + this.unblock = null } } componentWillMount() { - if (this.props.when) this.enable(this.props.message); + if (this.props.when) this.enable(this.props.message) } componentWillReceiveProps(nextProps) { if (nextProps.when) { if (!this.props.when || this.props.message !== nextProps.message) - this.enable(nextProps.message); + this.enable(nextProps.message) } else { - this.disable(); + this.disable() } } componentWillUnmount() { - this.disable(); + this.disable() } render() { - return null; + return null } } -export default Prompt; +export default Prompt diff --git a/modules/PropTypes.js b/modules/PropTypes.js index 8467873..00d4e79 100644 --- a/modules/PropTypes.js +++ b/modules/PropTypes.js @@ -1,6 +1,6 @@ -import PropTypes from "prop-types"; +import PropTypes from "prop-types" -export const action = PropTypes.oneOf(["PUSH", "REPLACE", "POP"]); +export const action = PropTypes.oneOf(["PUSH", "REPLACE", "POP"]) export const location = PropTypes.shape({ pathname: PropTypes.string.isRequired, @@ -8,7 +8,7 @@ export const location = PropTypes.shape({ hash: PropTypes.string.isRequired, state: PropTypes.object, key: PropTypes.string -}); +}) export const history = PropTypes.shape({ action: action.isRequired, @@ -20,4 +20,4 @@ export const history = PropTypes.shape({ goForward: PropTypes.func.isRequired, canGo: PropTypes.func, block: PropTypes.func.isRequired -}); +}) diff --git a/modules/index.js b/modules/index.js index 96dd60d..79b77ac 100644 --- a/modules/index.js +++ b/modules/index.js @@ -1,5 +1,5 @@ -export BrowserHistory from "./BrowserHistory"; -export HashHistory from "./HashHistory"; -export MemoryHistory from "./MemoryHistory"; -export Prompt from "./Prompt"; -export * from "./Actions"; +export BrowserHistory from "./BrowserHistory" +export HashHistory from "./HashHistory" +export MemoryHistory from "./MemoryHistory" +export Prompt from "./Prompt" +export * from "./Actions"