diff --git a/src/components/Navigation/Pages/PageBrowse/PageBrowse.js b/src/components/Navigation/Pages/PageBrowse/PageBrowse.js
index 38a19dda..9a617a43 100644
--- a/src/components/Navigation/Pages/PageBrowse/PageBrowse.js
+++ b/src/components/Navigation/Pages/PageBrowse/PageBrowse.js
@@ -31,7 +31,9 @@ import searchSvg from '../../../../images/icons/searchSvg.svg'
class PageBrowse extends SystemManagedList {
constructor(props) {
super(props)
+ // keep the state initialized by SystemManagedList (e.g. sequence), otherwise sequence + 1 ends up as NaN
this.state = {
+ ...this.state,
activeSort: 'releaseDate-desc',
searchFocused: false,
selectedProvider: providers[0],
diff --git a/src/components/__tests__/PageBrowse.test.js b/src/components/__tests__/PageBrowse.test.js
index a8b3059a..ac4e0fee 100644
--- a/src/components/__tests__/PageBrowse.test.js
+++ b/src/components/__tests__/PageBrowse.test.js
@@ -1,11 +1,17 @@
import React from 'react'
-import { render } from '@testing-library/react'
+import { render, act } from '@testing-library/react'
import { Provider } from 'react-redux'
import { BrowserRouter } from 'react-router-dom'
import configureMockStore from 'redux-mock-store'
import thunk from 'redux-thunk'
import ConnectedPageBrowse from '../Navigation/Pages/PageBrowse'
+let mockComponentListProps = null
+jest.mock('../ComponentList', () => props => {
+ mockComponentListProps = props
+ return null
+})
+
const middlewares = [thunk]
const mockStore = configureMockStore(middlewares)
@@ -51,7 +57,22 @@ const renderWithProviders = (ui, { store = defaultStore } = {}) => {
}
describe('PageBrowse', () => {
+ beforeEach(() => {
+ mockComponentListProps = null
+ })
+
it('renders without crashing', () => {
renderWithProviders()
})
+
+ it('keeps a numeric sequence when a component is expanded', async () => {
+ renderWithProviders()
+ expect(mockComponentListProps.sequence).toBe(0)
+
+ const component = { type: 'npm', provider: 'npmjs', name: 'test', revision: '1.0.0' }
+ await act(async () => {
+ await mockComponentListProps.onChange(component, { ...component, expanded: true })
+ })
+ expect(mockComponentListProps.sequence).toBe(1)
+ })
})