3.16 -> 3.17

This page lists the highlights for upgrading a project from Front-Commerce 3.16 to 3.17

Update dependencies

Update all your @front-commerce/* dependencies to this version:

pnpm update "@front-commerce/*@3.17.0"

Manual Migration

Facet reset fixes in useLayoutFacets

If you have overridden the useLayoutFacets.js hook from the theme-chocolatine package, you need to update your implementation to fix facet reset functionality.

What changed:

The onReset and onResetAll functions now properly handle form submissions by:

1. Specifying the current route as the form action to prevent unwanted redirects
2. Deleting both regular field names and their array notation variants (fieldName[])

Migration steps:

1. Update the onReset function to delete array notation fields and specify the action:

  const onReset = (names) => {
    return (event) => {
      // ... validation code ...
      const formData = new FormData(event.currentTarget.form);
      for (const name of names) {
        formData.delete(`${name}`);
+       formData.delete(`${name}[]`);
      }
      event.currentTarget.form.reset();
-     submit(formData, { method: "get" });
+     submit(formData, { method: "get", action: location.pathname });
    };
  };

2. Update the onResetAll function to specify the action:

  const onResetAll = () => {
    const formData = new FormData();
    formData.set("sort", currentFacetValues.sort);
    formData.set("pageLength", currentFacetValues.pageLength);
-   submit(formData);
+   submit(formData, { method: "get", action: location.pathname });
  };

These changes ensure that resetting facets removes all filter parameters from the URL and stays on the current page.