[create-pull-request] automated change (#30797)

Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>

.github/workflows/build.yml

@@ -45,7 +45,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   # Disable cache on Windows as it is slower than not caching
                   # https://github.com/actions/setup-node/issues/975

.github/workflows/build_develop.yml

@@ -28,7 +28,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"

.github/workflows/docs.yml

@@ -33,7 +33,7 @@ jobs:
                   repository: matrix-org/matrix-js-sdk
                   path: matrix-js-sdk
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   cache-dependency-path: element-web/yarn.lock

.github/workflows/end-to-end-tests.yaml

@@ -54,7 +54,7 @@ jobs:
               with:
                   repository: element-hq/element-web
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"
@@ -89,7 +89,7 @@ jobs:
 
             - name: Calculate runner variables
               id: runner-vars
-              uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+              uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               with:
                   script: |
                       const numRunners = parseInt(process.env.NUM_RUNNERS, 10);
@@ -140,7 +140,7 @@ jobs:
                   name: webapp
                   path: webapp
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   cache-dependency-path: yarn.lock
@@ -207,7 +207,7 @@ jobs:
                   persist-credentials: false
                   repository: element-hq/element-web
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               if: inputs.skip != true
               with:
                   cache: "yarn"

.github/workflows/issue_closed.yml

@@ -10,7 +10,7 @@ jobs:
         name: Tidy closed issues
         runs-on: ubuntu-24.04
         steps:
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               id: main
               with:
                   # PAT needed as the GITHUB_TOKEN won't be able to see cross-references from other orgs (matrix-org)
@@ -142,7 +142,7 @@ jobs:
                           });
                         }
                       }
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               name: Close duplicate as Not Planned
               if: steps.main.outputs.closeAsNotPlanned
               with:

.github/workflows/pending-reviews.yaml

@@ -16,7 +16,7 @@ jobs:
             URL: "https://github.com/pulls?q=is%3Apr+is%3Aopen+repo%3Amatrix-org%2Fmatrix-js-sdk+repo%3Amatrix-org%2Fmatrix-react-sdk+repo%3Aelement-hq%2Felement-web+repo%3Aelement-hq%2Felement-desktop+review-requested%3A%40me+sort%3Aupdated-desc+"
             RELEASE_BLOCKERS_URL: "https://github.com/pulls?q=is%3Aopen+repo%3Amatrix-org%2Fmatrix-js-sdk+repo%3Amatrix-org%2Fmatrix-react-sdk+repo%3Aelement-hq%2Felement-web+repo%3Aelement-hq%2Felement-desktop+sort%3Aupdated-desc+label%3AX-Release-Blocker+"
         steps:
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               env:
                   HS_URL: ${{ secrets.BETABOT_HS_URL }}
                   ROOM_ID: ${{ secrets.ROOM_ID }}

.github/workflows/pull_request_base_branch.yaml

@@ -8,7 +8,7 @@ jobs:
         name: Check PR base branch
         runs-on: ubuntu-24.04
         steps:
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               with:
                   script: |
                       const baseBranch = context.payload.pull_request.base.ref;

.github/workflows/shared-component-visual-tests.yaml

@@ -26,7 +26,7 @@ jobs:
                   persist-credentials: false
                   repository: element-hq/element-web
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"

.github/workflows/static_analysis.yaml

@@ -25,7 +25,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"
@@ -70,7 +70,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"
@@ -88,7 +88,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"
@@ -106,7 +106,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"
@@ -124,7 +124,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"

.github/workflows/tests.yml

@@ -44,7 +44,7 @@ jobs:
                   repository: ${{ inputs.matrix-js-sdk-sha && 'element-hq/element-web' || github.repository }}
 
             - name: Yarn cache
-              uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+              uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   node-version: "lts/*"
                   cache: "yarn"

.github/workflows/triage-labelled.yml

@@ -27,7 +27,7 @@ jobs:
             contains(github.event.issue.labels.*.name, 'A-Rich-Text-Editor') ||
             contains(github.event.issue.labels.*.name, 'A-Element-Call')
         steps:
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               with:
                   script: |
                       github.rest.issues.addLabels({
@@ -44,7 +44,7 @@ jobs:
             contains(github.event.issue.labels.*.name, 'good first issue') ||
             contains(github.event.issue.labels.*.name, 'Hacktoberfest')
         steps:
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               with:
                   script: |
                       github.rest.issues.addLabels({

.github/workflows/triage-stale.yml

@@ -12,7 +12,7 @@ jobs:
             issues: write
             pull-requests: write
         steps:
-            - uses: actions/stale@5bef64f19d7facfb25b37b414482c7164d639639 # v9
+            - uses: actions/stale@3a9db7e6a41a89f618792c92c0e97cc736e1b13f # v10
               with:
                   operations-per-run: 100
 

.github/workflows/triage-unlabelled.yml

@@ -62,7 +62,7 @@ jobs:
             contains(github.event.issue.labels.*.name, 'A-Element-Call')) &&
             contains(github.event.issue.labels.*.name, 'Z-Labs')
         steps:
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               with:
                   script: |
                       github.rest.issues.removeLabel({

.github/workflows/update-jitsi.yml

@@ -11,7 +11,7 @@ jobs:
         steps:
             - uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5
 
-            - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+            - uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
               with:
                   cache: "yarn"
                   node-version: "lts/*"

.github/workflows/update-topics.yaml

@@ -22,7 +22,7 @@ jobs:
         runs-on: ubuntu-24.04
         environment: Matrix
         steps:
-            - uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # v7
+            - uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
               env:
                   HS_URL: ${{ secrets.BETABOT_HS_URL }}
                   LOBBY_ROOM_ID: ${{ secrets.ROOM_ID }}

Dockerfile

@@ -1,7 +1,7 @@
-# syntax=docker.io/docker/dockerfile:1.17-labs@sha256:9187104f31e3a002a8a6a3209ea1f937fb7486c093cbbde1e14b0fa0d7e4f1b5
+# syntax=docker.io/docker/dockerfile:1.18-labs@sha256:79cdc14e1c220efb546ad14a8ebc816e3277cd72d27195ced5bebdd226dd1025
 
 # Builder
-FROM --platform=$BUILDPLATFORM node:22-bullseye@sha256:f7f28d1962d93cc096ea6327378d990284757fec281ce48e42436e7b4b167fa2 AS builder
+FROM --platform=$BUILDPLATFORM node:22-bullseye@sha256:f8c398a3ad2612293e8827915c056ed0f5cc708b0f676274bb6c732e3c10f93d AS builder
 
 # Support custom branch of the js-sdk. This also helps us build images of element-web develop.
 ARG USE_CUSTOM_SDKS=false

jest.config.ts

@@ -41,7 +41,7 @@ const config: Config = {
         "recorderWorkletFactory": "<rootDir>/__mocks__/empty.js",
         "^fetch-mock$": "<rootDir>/node_modules/fetch-mock",
     },
-    transformIgnorePatterns: ["/node_modules/(?!(mime|matrix-js-sdk)).+$"],
+    transformIgnorePatterns: ["/node_modules/(?!(mime|matrix-js-sdk|uuid|p-retry|is-network-error)).+$"],
     collectCoverageFrom: [
         "<rootDir>/src/**/*.{js,ts,tsx}",
         // getSessionLock is piped into a different JS context via stringification, and the coverage functionality is

package.json

@@ -79,7 +79,7 @@
         "@types/react-dom": "19.1.9",
         "oidc-client-ts": "3.3.0",
         "jwt-decode": "4.0.0",
-        "caniuse-lite": "1.0.30001741",
+        "caniuse-lite": "1.0.30001724",
         "testcontainers": "^11.0.0",
         "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0",
         "wrap-ansi": "npm:wrap-ansi@^7.0.0"
@@ -142,7 +142,7 @@
         "opus-recorder": "^8.0.3",
         "pako": "^2.0.3",
         "png-chunks-extract": "^1.0.0",
-        "posthog-js": "1.261.0",
+        "posthog-js": "1.265.1",
         "qrcode": "1.5.4",
         "re-resizable": "6.11.2",
         "react": "^19.0.0",
@@ -159,7 +159,7 @@
         "tar-js": "^0.3.0",
         "temporal-polyfill": "^0.3.0",
         "ua-parser-js": "1.0.40",
-        "uuid": "^11.0.0",
+        "uuid": "^13.0.0",
         "what-input": "^5.2.10"
     },
     "devDependencies": {
@@ -232,7 +232,6 @@
         "@types/semver": "^7.5.8",
         "@types/tar-js": "^0.3.5",
         "@types/ua-parser-js": "^0.7.36",
-        "@types/uuid": "^10.0.0",
         "@typescript-eslint/eslint-plugin": "^8.19.0",
         "@typescript-eslint/parser": "^8.19.0",
         "babel-jest": "^29.0.0",

playwright/testcontainers/mas.ts

@@ -10,7 +10,7 @@ import {
     type StartedPostgreSqlContainer,
 } from "@element-hq/element-web-playwright-common/lib/testcontainers";
 
-const TAG = "main@sha256:a29fa92aca82fd4cdf6b84abaa14935f111f281f9bffeb30fdb8fe2353c0108c";
+const TAG = "main@sha256:b87a65dafbc91e1eb64d481a95aeaf1bf471334f24455389c232f95790f44f5b";
 
 /**
  * MatrixAuthenticationServiceContainer which freezes the docker digest to

playwright/testcontainers/synapse.ts

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 
 import { SynapseContainer as BaseSynapseContainer } from "@element-hq/element-web-playwright-common/lib/testcontainers";
 
-const TAG = "develop@sha256:40ef11b61d70bda94266324d159cc7d807e64b26ad03788e386d5084abb3c198";
+const TAG = "develop@sha256:66eed0772418cc5f98f71a6c0bfba7fed057574f044a69a889fbc50120eb1aa3";
 
 /**
  * SynapseContainer which freezes the docker digest to stabilise tests,

res/css/views/rooms/RoomListPanel/_RoomListPrimaryFilters.pcss

@@ -12,10 +12,7 @@
         display: none;
     }
 
-    ul {
-        margin: unset;
-        padding: unset;
-        list-style-type: none;
+    .mx_RoomListPrimaryFilters_list {
         /**
          * The InteractionObserver needs the height to be set to work properly.
          */

src/components/views/rooms/RoomListPanel/RoomListPrimaryFilters.tsx

@@ -59,6 +59,7 @@ export function RoomListPrimaryFilters({ vm }: RoomListPrimaryFiltersProps): JSX
                 align="center"
                 gap="var(--cpd-space-2x)"
                 wrap="wrap"
+                className="mx_RoomListPrimaryFilters_list"
                 ref={ref}
             >
                 {filters.map((filter, i) => (
@@ -103,7 +104,7 @@ function useCollapseFilters<T extends HTMLElement>(
 
                 // If the previous element is on the left element of the current one, it means that the filter is wrapping
                 const previousSibling = child.previousElementSibling as HTMLElement | null;
-                if (previousSibling && child.offsetLeft < previousSibling.offsetLeft) {
+                if (previousSibling && child.offsetLeft <= previousSibling.offsetLeft) {
                     if (!isWrapping) setWrappingIndex(i);
                     isWrapping = true;
                 }

test/unit-tests/SupportedBrowser-test.ts

@@ -64,19 +64,19 @@ describe("SupportedBrowser", () => {
     // Grabbed from https://www.whatismybrowser.com/guides/the-latest-user-agent/
     it.each([
         // Safari 18.0 on macOS Sonoma
-        "Mozilla/5.0 (Macintosh; Intel Mac OS X 15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.6 Safari/605.1.15",
+        "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0 Safari/605.1.15",
         // Latest Firefox on macOS Sonoma
-        "Mozilla/5.0 (Macintosh; Intel Mac OS X 15.7; rv:143.0) Gecko/20100101 Firefox/143.0",
+        "Mozilla/5.0 (Macintosh; Intel Mac OS X 14.7; rv:139.0) Gecko/20100101 Firefox/139.0",
         // Latest Edge on Windows
-        "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36",
+        "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36 Edg/136.0.3240.92",
         // Latest Edge on macOS
-        "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36 Edg/140.0.3485.66",
+        "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36 Edg/136.0.3240.92",
         // Latest Firefox on Windows
-        "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:143.0) Gecko/20100101 Firefox/143.0",
+        "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:139.0) Gecko/20100101 Firefox/139.0",
         // Latest Firefox on Linux
-        "Mozilla/5.0 (X11; Linux i686; rv:143.0) Gecko/20100101 Firefox/143.0",
+        "Mozilla/5.0 (X11; Fedora; Linux x86_64; rv:139.0) Gecko/20100101 Firefox/139.0",
         // Latest Chrome on Windows
-        "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36",
+        "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36",
     ])("should not warn for supported browsers", testUserAgentFactory());
 
     it.each([

test/unit-tests/components/views/rooms/RoomListPanel/RoomListPrimaryFilters-test.tsx

@@ -35,15 +35,26 @@ describe("<RoomListPrimaryFilters />", () => {
 
         vm = {
             primaryFilters: [
-                { name: "People", active: false, toggle: filterToggleMocks[0], key: FilterKey.PeopleFilter },
-                { name: "Rooms", active: true, toggle: filterToggleMocks[1], key: FilterKey.RoomsFilter },
+                { name: "People", active: true, toggle: filterToggleMocks[0], key: FilterKey.PeopleFilter },
+                { name: "Rooms", active: false, toggle: filterToggleMocks[1], key: FilterKey.RoomsFilter },
                 { name: "Unreads", active: false, toggle: filterToggleMocks[2], key: FilterKey.UnreadFilter },
             ],
         } as unknown as RoomListViewState;
     });
 
+    function mockFiltersOffsetLeft() {
+        // Use `getByText` instead of `getByRole` to bypass the aria-hidden
+        jest.spyOn(screen.getByText("People"), "offsetLeft", "get").mockReturnValue(0);
+        jest.spyOn(screen.getByText("Rooms"), "offsetLeft", "get").mockReturnValue(30);
+        jest.spyOn(screen.getByText("Unreads"), "offsetLeft", "get").mockReturnValue(60);
+
+        // @ts-ignore
+        act(() => resizeCallback([{ target: screen.getByRole("listbox", { name: "Room list filters" }) }]));
+    }
+
     it("should renders all filters correctly", () => {
         const { asFragment } = render(<RoomListPrimaryFilters vm={vm} />);
+        mockFiltersOffsetLeft();
 
         // Check that all filters are rendered
         expect(screen.getByRole("option", { name: "People" })).toBeInTheDocument();
@@ -51,8 +62,8 @@ describe("<RoomListPrimaryFilters />", () => {
         expect(screen.getByRole("option", { name: "Unreads" })).toBeInTheDocument();
 
         // Check that the active filter is marked as selected
-        expect(screen.getByRole("option", { name: "Rooms" })).toHaveAttribute("aria-selected", "true");
-        expect(screen.getByRole("option", { name: "People" })).toHaveAttribute("aria-selected", "false");
+        expect(screen.getByRole("option", { name: "People" })).toHaveAttribute("aria-selected", "true");
+        expect(screen.getByRole("option", { name: "Rooms" })).toHaveAttribute("aria-selected", "false");
         expect(screen.getByRole("option", { name: "Unreads" })).toHaveAttribute("aria-selected", "false");
 
         expect(asFragment()).toMatchSnapshot();
@@ -61,6 +72,7 @@ describe("<RoomListPrimaryFilters />", () => {
     it("should call toggle function when a filter is clicked", async () => {
         const user = userEvent.setup();
         render(<RoomListPrimaryFilters vm={vm} />);
+        mockFiltersOffsetLeft();
 
         // Click on an inactive filter
         await user.click(screen.getByRole("option", { name: "People" }));
@@ -69,24 +81,27 @@ describe("<RoomListPrimaryFilters />", () => {
         expect(filterToggleMocks[0]).toHaveBeenCalledTimes(1);
     });
 
-    function mockFiltersOffsetLeft() {
-        jest.spyOn(screen.getByRole("option", { name: "People" }), "offsetLeft", "get").mockReturnValue(0);
-        jest.spyOn(screen.getByRole("option", { name: "Rooms" }), "offsetLeft", "get").mockReturnValue(30);
+    function makeUnreadWrapping() {
+        // Use `getByText` instead of `getByRole` to bypass the aria-hidden
+        jest.spyOn(screen.getByText("People"), "offsetLeft", "get").mockReturnValue(0);
+        jest.spyOn(screen.getByText("Rooms"), "offsetLeft", "get").mockReturnValue(30);
         // Unreads is wrapping
-        jest.spyOn(screen.getByRole("option", { name: "Unreads" }), "offsetLeft", "get").mockReturnValue(0);
+        jest.spyOn(screen.getByText("Unreads"), "offsetLeft", "get").mockReturnValue(0);
+
+        // @ts-ignore
+        act(() => resizeCallback([{ target: screen.getByRole("listbox", { name: "Room list filters" }) }]));
     }
 
     it("should hide or display filters if they are wrapping", async () => {
         const user = userEvent.setup();
         render(<RoomListPrimaryFilters vm={vm} />);
+        mockFiltersOffsetLeft();
 
         // No filter is wrapping, so chevron shouldn't be visible
         expect(screen.queryByRole("button", { name: "Expand filter list" })).toBeNull();
         expect(screen.queryByRole("option", { name: "Unreads" })).toBeVisible();
 
-        mockFiltersOffsetLeft();
-        // @ts-ignore
-        act(() => resizeCallback([{ target: screen.getByRole("listbox", { name: "Room list filters" }) }]));
+        makeUnreadWrapping();
 
         // The Unreads filter is wrapping, it should not be visible
         expect(screen.queryByRole("option", { name: "Unreads" })).toBeNull();
@@ -107,9 +122,7 @@ describe("<RoomListPrimaryFilters />", () => {
 
         const user = userEvent.setup();
         render(<RoomListPrimaryFilters vm={vm} />);
-        mockFiltersOffsetLeft();
-        // @ts-ignore
-        act(() => resizeCallback([{ target: screen.getByRole("listbox", { name: "Room list filters" }) }]));
+        makeUnreadWrapping();
 
         // Unread filter should be moved to the first position
         expect(screen.getByRole("listbox", { name: "Room list filters" }).children[0]).toBe(
@@ -122,4 +135,21 @@ describe("<RoomListPrimaryFilters />", () => {
             screen.getByRole("option", { name: "Unreads" }),
         );
     });
+
+    it("should hide the filter is the previous is on the same vertical position", async () => {
+        render(<RoomListPrimaryFilters vm={vm} />);
+        mockFiltersOffsetLeft();
+
+        jest.spyOn(screen.getByRole("option", { name: "People" }), "offsetLeft", "get").mockReturnValue(0);
+        // Rooms is wrapping
+        jest.spyOn(screen.getByRole("option", { name: "Rooms" }), "offsetLeft", "get").mockReturnValue(0);
+
+        // @ts-ignore
+        act(() => resizeCallback([{ target: screen.getByRole("listbox", { name: "Room list filters" }) }]));
+
+        // The Unreads filter is wrapping, it should not be visible
+        expect(screen.queryByRole("option", { name: "Rooms" })).toBeNull();
+        // Now filters are wrapping, so chevron should be visible
+        expect(screen.getByRole("button", { name: "Expand filter list" })).toBeVisible();
+    });
 });

test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListPrimaryFilters-test.tsx.snap

@@ -9,14 +9,14 @@ exports[`<RoomListPrimaryFilters /> should renders all filters correctly 1`] = `
   >
     <div
       aria-label="Room list filters"
-      class="flex"
+      class="flex mx_RoomListPrimaryFilters_list"
       id="«r0»"
       role="listbox"
       style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: wrap;"
     >
       <button
         aria-hidden="false"
-        aria-selected="false"
+        aria-selected="true"
         class="_chat-filter_5qdp0_8"
         role="option"
         tabindex="0"
@@ -25,7 +25,7 @@ exports[`<RoomListPrimaryFilters /> should renders all filters correctly 1`] = `
       </button>
       <button
         aria-hidden="false"
-        aria-selected="true"
+        aria-selected="false"
         class="_chat-filter_5qdp0_8"
         role="option"
         tabindex="0"