Rerouter is a minimal router for [ReasonReact](https://reasonml.github.io/reason-react/) projects. It uses [history](https://github.com/ReactTraining/history) under the hood to make testing simple.
npm install @drewschrauf/rerouterRerouter is a minimal router for ReasonReact projects. It uses history under the hood to make testing simple.
Yes! An excellent one, in fact.
However, its strength is also its weakness. It provides very thin bindings to the browser's API for reading and updating the URL. Unfortunately, these APIs are not supported by Jest (and, by extension, @glennsl/bs-jest).
This router makes use of history to enable the use of the browser history in the browser and an in-memory history for testing.
Just install the package
``bash`
yarn add @drewschrauf/rerouter
and add it to your bsconfig.json
`json`
{
...,
"bs-dependencies": {
...,
"@drewschrauf/rerouter"
}
}
Simply wrap the component around your application and you're good to go.
`reason`
/ Index.re /
ReactDOMRe.renderToElementWithId(
Within your app you can make use of useUrl() and useHistory() to get your current location and update it respectively.
When you're writing your tests (ideally with @glennsl/bs-jest and @drewschrauf/react-testing-library), render your app inside a component with a memory history instead.
`reason`
/ MyTest_test.re /
test("app should render", () => {
let history = Rerouter.History.createMemoryHistory(~initialEntries=["/"], ());
render(
})
The API is heavily based on ReasonReactRouter. It's worth giving their own documentation a read to see why this approach to a React router is so perfect for Reason.
The history context provider. The must be wrapped around your application in order to be able to use the following hooks. If no history is passed, a browser history is instantiated and used.
useUrl(): { path: list(string), search: string, hash: string }
Retrieves the current URL parts. The API is identical to that provided by ReasonReactRouter.
useHistory(): Rerouter.History.t
Retrieves the history object. This is required for passing to the push and replace methods below.
createBrowserHistory(~basename: string=?, ~forceRefresh: bool=?, ~keyLength: int=?, ()): Rerouter.History.t
Create a history object for use within the browser. You usually won't need to call this yourself unless you want to customise the instance. Using without a history argument will instantiate one of these by default.
createMemoryHistory(~initialEntries: list(string)=?, ~initialIndex: int=?, ~keyLength: int=?, ()): Rerouter.History.t
Create a history object for use in tests. Pass this as the history prop of your context provider.
push(history: Rerouter.History.t, url: string): unit
Navigate to the given URL.
replace(history: Rerouter.History.t, url: string): unit`
Navigate to the given URL, replacing the current URL in the history.