Testing
Automated router tests need a controlled starting location without changing the browser URL.
TanStack · Function
createMemoryHistory
Creates a TanStack Router history whose navigation entries are stored in memory. Initialize it with initialEntries, then pass the history instance to a router.
How it works
createMemoryHistory builds a router history implementation whose entries live only in memory. Provide initialEntries to establish the starting URL, then pass the resulting history object to the Router constructor or configuration.
Syntax
createMemoryHistory(options)Parameters
| Name | Type | Description |
|---|---|---|
options | MemoryHistoryOptions | Configuration object containing the initial history entries, such as an initial URL. |
Returns
A memory-backed router history instance.
Key points
- The function creates a history implementation backed by in-memory entries.
- Use
initialEntriesto provide the starting URL for the history. - The returned history instance is supplied to the Router constructor or router configuration.
- It supports routing in non-browser environments.
- It keeps route navigation separate from the URL when components should not modify it.
Common mistakes
- Use memory history when the application runs outside a browser; it does not use browser URL history.
- Choose this history type when route changes should remain internal rather than update the URL.
Example: Create a router with memory history
import { createMemoryHistory, createRouter } from '@tanstack/react-router'
const history = createMemoryHistory({
initialEntries: ['/'],
})
const router = createRouter({ routeTree, history })
Creates an in-memory history and supplies it to a TanStack Router instance.
When to use it
Non-browser environments
The application runs outside a browser and still needs client-style navigation.
URL-independent routing
Routes should change without exposing navigation through the browser URL.
Interview questions
QWhat does createMemoryHistory provide?
It creates a history type that keeps navigation entries in memory instead of using the browser's URL history. The returned history can be passed to createRouter as its history option.
Follow-up: Why is it useful in tests? It lets tests set deterministic starting entries without depending on a browser location or changing the real URL.
QHow do you initialize memory history?
Pass an options object containing initialEntries, such as ['/'], to define the initial URL represented by the memory history. Then give the returned instance to the router configuration.
Follow-up: What would happen if the initial entry were a nested route? The router would begin from that path, subject to the route tree and its matching behavior.
QWhen should memory routing be used?
Memory routing is appropriate when there is no browser environment or when components should not interact with the URL. Typical examples include tests and other non-browser execution contexts.
Follow-up: How does this differ conceptually from browser history? Browser history integrates with the browser URL, while memory history retains navigation state in memory.
Related
createBrowserHistorycreateHashHistorycreateRouterRouterHistory