fix(ui): изолировать источники данных Filters

tests/e2e/filters-context.spec.ts

@@ -0,0 +1,93 @@
+import { test, expect, type Page } from "@playwright/test"
+const headers = { "access-control-allow-origin": "*", "access-control-allow-methods": "GET,POST,PUT,PATCH,DELETE,OPTIONS", "access-control-allow-headers": "Content-Type,Authorization" }
+const makeRule = (port: string) => ({ id: "rule-1", community: port === "8101" ? "65001:201" : "65001:101", gateway: "", gatewayTunnelId: "", action: "blackhole", description: port === "8101" ? "Новый источник" : "Старый источник" })
+async function setup(page: Page) {
+  let oldReads = 0
+  await page.route("**/health", route => route.fulfill({ headers, json: { ok: true } }))
+  await page.route("**/api/**", route => {
+    const url = new URL(route.request().url()), path = url.pathname
+    if (path === "/api/filters/rules" && url.port === "8000" && route.request().method() === "GET") oldReads++
+    return route.fulfill({ headers, json: path === "/api/filters/rules" ? { rulesets: [{ serverId: "1", rules: [makeRule(url.port)] }], greTunnels: [], live: true }
+      : path === "/api/servers" ? [{ id: 1, name: "Роутер", host: "192.0.2.1", type: "exit-node", enabled: true, country: "RU", site: "TEST", asn: "", status: "online", latency: 1 }]
+      : path === "/api/auth/config" ? { required: false }
+      : path === "/api/filters/gre-tunnels" ? { tunnels: [] }
+      : path === "/api/recursive-routes" ? { routes: [] } : {} })
+  })
+  await page.goto("/settings")
+  await page.getByRole("link", { name: /^Фильтры/ }).click()
+  await expect(page.locator("tr[data-row-id]")).toHaveCount(1)
+  await expect(page.getByRole("button", { name: "Новое правило", exact: true })).toBeEnabled()
+  return () => oldReads
+}
+async function changeContext(page: Page, change: string) {
+  await page.goBack()
+  await expect(page).toHaveURL(/settings/)
+  if (change === "backend") {
+    const input = page.getByPlaceholder("http://localhost:8000")
+    await input.fill("http://localhost:8101")
+    await input.press("Enter")
+  } else await page.getByRole("button", { name: "Моковые", exact: true }).click()
+  await page.getByRole("link", { name: /^Фильтры/ }).click()
+  if (change === "backend") await expect(page.locator("tr[data-row-id]")).toContainText("Новый источник")
+  else await expect(page.locator('tr[data-row-id="rule-1"]')).toHaveCount(0)
+}
+async function flush(page: Page) {
+  await page.evaluate(() => new Promise<void>(resolve => requestAnimationFrame(() => requestAnimationFrame(() => resolve()))))
+}
+for (const fails of [false, true]) {
+  test(`Filters: старое чтение при смене backend ${fails}`, async ({ page }) => {
+    await setup(page)
+    let release: (() => void) | undefined
+    const gate = new Promise<void>(resolve => { release = resolve })
+    let started = false
+    await page.route("**/api/filters/rules?serverId=1", async route => {
+      if (new URL(route.request().url()).port !== "8000") return route.fallback()
+      started = true
+      await gate
+      return route.fulfill(fails ? { headers, status: 503, json: { error: "Ошибка старого источника" } } : { headers, json: { rulesets: [{ serverId: "1", rules: [] }], greTunnels: [], live: true } })
+    })
+    await page.getByRole("button", { name: "Обновить", exact: true }).click()
+    await expect.poll(() => started).toBe(true)
+    await changeContext(page, "backend")
+    const response = page.waitForResponse(r => r.url().includes(":8000/api/filters/rules?serverId=1"))
+    release!()
+    await (await response).finished()
+    await flush(page)
+    await expect(page.locator("tr[data-row-id]")).toHaveCount(1)
+    await expect(page.locator("tr[data-row-id]")).toContainText("Новый источник")
+    await expect(page.getByRole("button", { name: "Новое правило", exact: true })).toBeEnabled()
+    await expect(page.getByText("Не удалось прочитать правила с роутера", { exact: true })).toHaveCount(0)
+  })
+}
+for (const change of ["backend", "mode"]) {
+  for (const fails of [false, true]) {
+    test(`Filters: старое применение при смене ${change}/${fails}`, async ({ page }) => {
+      const oldReads = await setup(page)
+      let release: (() => void) | undefined
+      const gate = new Promise<void>(resolve => { release = resolve })
+      let started = false
+      await page.route("**/api/filters/rules", async route => {
+        if (route.request().method() === "OPTIONS") return route.fulfill({ headers, json: {} })
+        if (route.request().method() !== "PUT") return route.fallback()
+        started = true
+        await gate
+        return route.fulfill(fails ? { headers, status: 403, json: { error: "Старое применение запрещено" } } : { headers, json: { ok: true, rules: [] } })
+      })
+      await page.locator("tr[data-row-id]").first().hover()
+      await page.getByRole("button", { name: "Удалить правило", exact: true }).click()
+      await page.getByRole("alertdialog").getByRole("button", { name: "Удалить", exact: true }).click()
+      await expect.poll(() => started).toBe(true)
+      const before = oldReads()
+      await changeContext(page, change)
+      const response = page.waitForResponse(r => r.url().includes(":8000/api/filters/rules") && r.request().method() === "PUT")
+      release!()
+      await (await response).finished()
+      await flush(page)
+      expect(oldReads()).toBe(before)
+      await expect(page.getByText("Правила применены на роутер", { exact: true })).toHaveCount(0)
+      await expect(page.getByText("Не удалось применить правила на роутер", { exact: true })).toHaveCount(0)
+      await expect(page.getByRole("alertdialog")).toHaveCount(0)
+      await expect(page.getByRole("button", { name: "Новое правило", exact: true })).toBeEnabled()
+    })
+  }
+}