From 2067dba5ff4fbd62028c512e1fd1e2a038bdf24e Mon Sep 17 00:00:00 2001
From: Ariya Hidayat <ariya@metabase.com>
Date: Mon, 9 May 2022 07:50:07 -0700
Subject: [PATCH] Allow firing an event (e.g. clicking) on the checkbox's label
(#22488)
---
.../src/metabase/core/components/CheckBox/CheckBox.tsx | 2 ++
.../src/metabase/core/components/CheckBox/types.ts | 1 +
.../scenarios/onboarding/auth/signin.cy.spec.js | 10 ++++++++++
3 files changed, 13 insertions(+)
diff --git a/frontend/src/metabase/core/components/CheckBox/CheckBox.tsx b/frontend/src/metabase/core/components/CheckBox/CheckBox.tsx
index cbc3bcb4659..f899499b6b5 100644
--- a/frontend/src/metabase/core/components/CheckBox/CheckBox.tsx
+++ b/frontend/src/metabase/core/components/CheckBox/CheckBox.tsx
@@ -37,6 +37,7 @@ function CheckboxTooltip({
const CheckBox = forwardRef<HTMLLabelElement, CheckBoxProps>(function Checkbox(
{
+ name,
label,
labelEllipsis = false,
checked,
@@ -74,6 +75,7 @@ const CheckBox = forwardRef<HTMLLabelElement, CheckBoxProps>(function Checkbox(
onChange={isControlledCheckBoxInput ? onChange : undefined}
onFocus={onFocus}
onBlur={onBlur}
+ id={name}
/>
<CheckBoxContainer disabled={disabled}>
<CheckBoxIconContainer
diff --git a/frontend/src/metabase/core/components/CheckBox/types.ts b/frontend/src/metabase/core/components/CheckBox/types.ts
index 9f9b092593e..64b21685634 100644
--- a/frontend/src/metabase/core/components/CheckBox/types.ts
+++ b/frontend/src/metabase/core/components/CheckBox/types.ts
@@ -26,6 +26,7 @@ export interface CheckBoxLabelProps {
export interface CheckBoxProps
extends Omit<HTMLAttributes<HTMLElement>, "onChange" | "onFocus" | "onBlur"> {
+ name?: string;
label?: ReactNode;
labelEllipsis?: boolean;
checked?: boolean;
diff --git a/frontend/test/metabase/scenarios/onboarding/auth/signin.cy.spec.js b/frontend/test/metabase/scenarios/onboarding/auth/signin.cy.spec.js
index c16363f93ca..07d61b097cd 100644
--- a/frontend/test/metabase/scenarios/onboarding/auth/signin.cy.spec.js
+++ b/frontend/test/metabase/scenarios/onboarding/auth/signin.cy.spec.js
@@ -53,6 +53,16 @@ describe("scenarios > auth > signin", () => {
cy.contains(/[a-z ]+, Bob/i);
});
+ it("should allow toggling of Remember Me", () => {
+ cy.visit("/auth/login");
+
+ // default initial state
+ cy.findByRole("checkbox").should("be.checked");
+
+ cy.findByLabelText("Remember me").click();
+ cy.findByRole("checkbox").should("not.be.checked");
+ });
+
it("should redirect to a unsaved question after login", () => {
cy.signInAsAdmin();
cy.visit("/");
--
GitLab