fix(Password): 更新隐藏/显示Icons (#2084)

* fix(Password): 更新隐藏/显示Icons * test(Password): update Password UT Co-authored-by: Zhang Rui <zhangrui@growingio.com>
growingio · Jul 28, 2022 · 9f22b2b · 9f22b2b · vercel · Jul 28, 2022
1 parent edc525b
commit 9f22b2b
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 12 deletions.
diff --git a/src/input/Password.tsx b/src/input/Password.tsx
@@ -24,9 +24,9 @@ const Password = React.forwardRef<HTMLInputElement, PasswordProps>((props, ref)
   const passwordSuffix = useMemo(
     () =>
       visible ? (
-        <EyeSlashOutlined className={passwordSuffixIconCls} onClick={toggleVisible} />
-      ) : (
         <EyeOutlined className={passwordSuffixIconCls} onClick={toggleVisible} />
+      ) : (
+        <EyeSlashOutlined className={passwordSuffixIconCls} onClick={toggleVisible} />
       ),
     [passwordSuffixIconCls, toggleVisible, visible]
   );

diff --git a/src/input/__tests__/Password.test.tsx b/src/input/__tests__/Password.test.tsx
@@ -7,23 +7,22 @@ describe('testing password', () => {
     const { container } = render(<Password defaultValue="111" />);
     expect(screen.getByTestId('input-password')).toBeTruthy();
     expect(container.querySelector('input[type="password"]')).toBeTruthy();
-    expect(container.querySelector('input[type="password"]').getAttribute('value')).toBe('111')
+    expect(container.querySelector('input[type="password"]').getAttribute('value')).toBe('111');
   });
   it('should change type when click password Suffix icon ', () => {
     const { container } = render(<Password defaultValue="111" />);
-    expect(container.querySelector('span[aria-label="eye-outlined"]')).toBeTruthy();
-    expect(container.querySelector('span[aria-label="eye-slash-outlined"]')).toBeFalsy();
+    expect(container.querySelector('span[aria-label="eye-slash-outlined"]')).toBeTruthy();
+    expect(container.querySelector('span[aria-label="eye-outlined"]')).toBeFalsy();
     expect(container.querySelector('input[type="password"]')).toBeTruthy();
-    fireEvent.click(container.querySelector('span[aria-label="eye-outlined"]'));
+    fireEvent.click(container.querySelector('span[aria-label="eye-slash-outlined"]'));
     expect(container.querySelector('input[type="password"]')).toBeFalsy();
-    expect(container.querySelector('span[aria-label="eye-outlined"]')).toBeFalsy();
-    expect(container.querySelector('span[aria-label="eye-slash-outlined"]')).toBeTruthy();
+    expect(container.querySelector('span[aria-label="eye-slash-outlined"]')).toBeFalsy();
+    expect(container.querySelector('span[aria-label="eye-outlined"]')).toBeTruthy();
   });
   it('should not change type when  password set disabled ', () => {
     const { container } = render(<Password defaultValue="111" disabled />);
 
-    fireEvent.click(container.querySelector('span[aria-label="eye-outlined"]'));
+    fireEvent.click(container.querySelector('span[aria-label="eye-slash-outlined"]'));
     expect(container.querySelector('input[type="password"]')).toBeTruthy();
-
-  })
-})
+  });
+});