reduce logs during setup tests (#46834)

* refactor: memoize getSteps selector

* screen.getXXX.click() => userEvent.click(...) to avoid missing act() warning

* use mockSettings so that MetabaseSettings.setAll is called and we avoid the unknown features warning

frontend/src/metabase/setup/selectors.ts

+import { createSelector } from "@reduxjs/toolkit";
+
 import { isEEBuild } from "metabase/lib/utils";
 import { getSetting } from "metabase/selectors/settings";
 import type {
@@ -88,39 +90,44 @@ export const getIsEmailConfigured = (state: State): boolean => {
   return getSetting(state, "email-configured?");
 };
 
-export const getSteps = (state: State) => {
-  const usageReason = getUsageReason(state);
-  const activeStep = getStep(state);
-  const tokenFeatures = getSetting(state, "token-features");
-
-  const isPaidPlan =
-    tokenFeatures && Object.values(tokenFeatures).some(value => value === true);
-  const hasAddedPaidPlanInPreviousStep = Boolean(state.setup.licenseToken);
-
-  const shouldShowDBConnectionStep = usageReason !== "embedding";
-  const shouldShowLicenseStep =
-    isEEBuild() && (!isPaidPlan || hasAddedPaidPlanInPreviousStep);
-
-  const steps: { key: SetupStep; isActiveStep: boolean }[] = [
-    { key: "welcome" as const },
-    { key: "language" as const },
-    { key: "user_info" as const },
-    { key: "usage_question" as const },
-    shouldShowDBConnectionStep && {
-      key: "db_connection" as const,
-    },
-    shouldShowLicenseStep && { key: "license_token" as const },
-    { key: "data_usage" as const },
-    { key: "completed" as const },
-  ]
-    .filter(isNotFalsy)
-    .map(({ key }) => ({
-      key,
-      isActiveStep: activeStep === key,
-    }));
-
-  return steps;
-};
+export const getSteps = createSelector(
+  [
+    (state: State) => getUsageReason(state),
+    (state: State) => getStep(state),
+    (state: State) => getSetting(state, "token-features"),
+    (state: State) => state.setup.licenseToken,
+  ],
+  (usageReason, activeStep, tokenFeatures, licenseToken) => {
+    const isPaidPlan =
+      tokenFeatures &&
+      Object.values(tokenFeatures).some(value => value === true);
+    const hasAddedPaidPlanInPreviousStep = Boolean(licenseToken);
+
+    const shouldShowDBConnectionStep = usageReason !== "embedding";
+    const shouldShowLicenseStep =
+      isEEBuild() && (!isPaidPlan || hasAddedPaidPlanInPreviousStep);
+
+    const steps: { key: SetupStep; isActiveStep: boolean }[] = [
+      { key: "welcome" as const },
+      { key: "language" as const },
+      { key: "user_info" as const },
+      { key: "usage_question" as const },
+      shouldShowDBConnectionStep && {
+        key: "db_connection" as const,
+      },
+      shouldShowLicenseStep && { key: "license_token" as const },
+      { key: "data_usage" as const },
+      { key: "completed" as const },
+    ]
+      .filter(isNotFalsy)
+      .map(({ key }) => ({
+        key,
+        isActiveStep: activeStep === key,
+      }));
+
+    return steps;
+  },
+);
 
 export const getNextStep = (state: State) => {
   const steps = getSteps(state);

frontend/src/metabase/setup/tests/common.unit.spec.tsx

@@ -139,7 +139,7 @@ describe("setup (OSS)", () => {
       await selectUsageReason("embedding");
       await clickNextStep();
 
-      await screen.getByText("Finish").click();
+      await userEvent.click(screen.getByText("Finish"));
 
       expect(await getLastSettingsPutPayload()).toEqual({
         "embedding-homepage": "visible",
@@ -158,9 +158,9 @@ describe("setup (OSS)", () => {
       await selectUsageReason("self-service-analytics");
       await clickNextStep();
 
-      await screen.getByText("I'll add my data later").click();
+      await userEvent.click(screen.getByText("I'll add my data later"));
 
-      await screen.getByText("Finish").click();
+      await userEvent.click(screen.getByText("Finish"));
 
       const flags = await getLastSettingsPutPayload();
 
@@ -186,7 +186,7 @@ describe("setup (OSS)", () => {
       await selectUsageReason("embedding");
       await clickNextStep();
 
-      await screen.getByText("Finish").click();
+      await userEvent.click(screen.getByText("Finish"));
 
       const flags = await getLastSettingsPutPayload();
 

frontend/src/metabase/setup/tests/enterprise.unit.spec.tsx

@@ -180,7 +180,7 @@ const errMsg = () => screen.findByText(/This token doesn’t seem to be valid/);
 const submitBtn = () => screen.findByRole("button", { name: "Activate" });
 
 const submit = async () => {
-  (await submitBtn()).click();
+  await userEvent.click(await submitBtn());
 
   const settingEndpoint = "path:/api/setting/premium-embedding-token";
   await waitFor(() => expect(fetchMock.done(settingEndpoint)).toBe(true));

frontend/src/metabase/setup/tests/premium.unit.spec.tsx

 /* eslint jest/expect-expect: ["error", { "assertFunctionNames": ["expect", "expectSectionToHaveLabel", "expectSectionsToHaveLabelsInOrder"] }] */
 
 import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 
 import { createMockTokenFeatures } from "metabase-types/api/mocks";
 
@@ -55,7 +56,7 @@ describe("setup (EE, hosting and embedding feature)", () => {
     await selectUsageReason("embedding");
     await clickNextStep();
 
-    screen.getByText("Finish").click();
+    await userEvent.click(screen.getByText("Finish"));
 
     expect(await getLastSettingsPutPayload()).toEqual({
       "embedding-homepage": "visible",

frontend/src/metabase/setup/tests/setup.tsx

@@ -7,6 +7,7 @@ import {
   setupPropertiesEndpoints,
   setupSettingsEndpoints,
 } from "__support__/server-mocks";
+import { mockSettings } from "__support__/settings";
 import { renderWithProviders, screen } from "__support__/ui";
 import type {
   SettingDefinition,
@@ -18,7 +19,6 @@ import {
   createMockTokenFeatures,
 } from "metabase-types/api/mocks";
 import {
-  createMockSettingsState,
   createMockSetupState,
   createMockState,
 } from "metabase-types/store/mocks";
@@ -45,10 +45,12 @@ export async function setup({
     setup: createMockSetupState({
       step: "welcome",
     }),
-    settings: createMockSettingsState({
-      "token-features": tokenFeatures,
-      "available-locales": [["en", "English"]],
-    }),
+    settings: mockSettings(
+      createMockSettings({
+        "token-features": tokenFeatures,
+        "available-locales": [["en", "English"]],
+      }),
+    ),
   });
 
   if (hasEnterprisePlugins) {