diff --git a/CHANGELOG.md b/CHANGELOG.md index d13b4c9019..78da25f52b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ # Changelog ## Draft +- Fixed focus for sort by dropdown on reloading page. [#1964](https://github.com/bigcommerce/cornerstone/pull/1964) - Updated Cornerstone theme and respected variants to meet the verticals/industries documented in BCTHEME-387 - Fixed selecting certain option types which pushes window view to the bottom of the page. [#1959](https://github.com/bigcommerce/cornerstone/pull/1959) - Fixed case when default option is out of stock add to cart button does not populate for in stock options. [#1955](https://github.com/bigcommerce/cornerstone/pull/1955) diff --git a/assets/js/theme/catalog.js b/assets/js/theme/catalog.js index be42a30d5e..2fb6c39e86 100644 --- a/assets/js/theme/catalog.js +++ b/assets/js/theme/catalog.js @@ -3,6 +3,23 @@ import urlUtils from './common/utils/url-utils'; import Url from 'url'; export default class CatalogPage extends PageManager { + constructor(context) { + super(context); + + window.addEventListener('beforeunload', () => { + if (document.activeElement.id === 'sort') { + window.localStorage.setItem('sortByStatus', 'selected'); + } + }); + } + + arrangeFocusOnSortBy($elementSelector) { + if (window.localStorage.getItem('sortByStatus')) { + $elementSelector.focus(); + window.localStorage.removeItem('sortByStatus'); + } + } + onSortBySubmit(event, currentTarget) { const url = Url.parse(window.location.href, true); const queryParams = $(currentTarget).serialize().split('='); diff --git a/assets/js/theme/category.js b/assets/js/theme/category.js index 2a7bee8a5f..3f3518f3f2 100644 --- a/assets/js/theme/category.js +++ b/assets/js/theme/category.js @@ -11,6 +11,8 @@ export default class Category extends CatalogPage { } onReady() { + this.arrangeFocusOnSortBy($('[data-sort-by="product"] #sort')); + $('[data-button-type="add-cart"]').on('click', (e) => { $(e.currentTarget).next().attr({ role: 'status', diff --git a/assets/js/theme/search.js b/assets/js/theme/search.js index d9ddaadcbf..b4124b1977 100644 --- a/assets/js/theme/search.js +++ b/assets/js/theme/search.js @@ -162,6 +162,7 @@ export default class Search extends CatalogPage { onReady() { compareProducts(this.context.urls); + this.arrangeFocusOnSortBy($('[data-sort-by="product"] #sort')); this.setupSortByQuerySearchParam(); const $searchForm = $('[data-advanced-search-form]');