From 49b7a0ccd20eedb16e5338be6ca3cf052a9cfffc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=81=8F=E5=8F=B3?= <afc163@gmail.com>
Date: Thu, 13 Feb 2020 17:32:07 +0800
Subject: [PATCH] test: Increase Slider and Input test coverage (#21364)

* :white_check_mark: Add test case to Slider

* increae cov and make hidden textarea works with screen readers
---
 components/input/__tests__/index.test.js  | 25 +++++++++++++++++------
 components/input/calculateNodeHeight.tsx  |  2 ++
 components/slider/__tests__/index.test.js | 10 +++++++++
 tests/shared/focusTest.js                 | 11 +++++-----
 4 files changed, 36 insertions(+), 12 deletions(-)

diff --git a/components/input/__tests__/index.test.js b/components/input/__tests__/index.test.js
index 6c56b1f5ee..fa7a3bd8db 100644
--- a/components/input/__tests__/index.test.js
+++ b/components/input/__tests__/index.test.js
@@ -88,16 +88,30 @@ describe('Input', () => {
 focusTest(TextArea);
 
 describe('TextArea', () => {
+  const originalGetComputedStyle = window.getComputedStyle;
   beforeAll(() => {
+    Object.defineProperty(window, 'getComputedStyle', {
+      value: (node) => ({
+        getPropertyValue: (prop) => {
+          if (prop === 'box-sizing') {
+            return originalGetComputedStyle(node)[prop] || 'border-box';
+          }
+          return originalGetComputedStyle(node)[prop];
+        },
+      }),
+    });
     jest.useFakeTimers();
   });
 
   afterAll(() => {
+    Object.defineProperty(window, 'getComputedStyle', {
+      value: originalGetComputedStyle,
+    });
     jest.useRealTimers();
   });
 
   it('should auto calculate height according to content length', () => {
-    const wrapper = mount(<TextArea value="" readOnly autoSize />);
+    const wrapper = mount(<TextArea value="" readOnly autoSize={{ minRows: 2, maxRows: 6 }} wrap="off" />);
     const mockFunc = jest.spyOn(wrapper.instance().resizableTextArea, 'resizeTextarea');
     wrapper.setProps({ value: '1111\n2222\n3333' });
     jest.runAllTimers();
@@ -144,10 +158,9 @@ describe('TextArea', () => {
     const value = calculateNodeStyling(wrapper, true);
     expect(value).toEqual({
       borderSize: 2,
-      boxSizing: '',
+      boxSizing: 'border-box',
       paddingSize: 4,
-      sizingStyle:
-        'letter-spacing:normal;line-height:normal;padding-top:2px;padding-bottom:2px;font-family:-webkit-small-control;font-weight:;font-size:;font-variant:;text-rendering:auto;text-transform:none;width:;text-indent:0;padding-left:2px;padding-right:2px;border-width:1px;box-sizing:',
+      sizingStyle: 'letter-spacing:normal;line-height:normal;padding-top:2px;padding-bottom:2px;font-family:-webkit-small-control;font-weight:;font-size:;font-variant:;text-rendering:auto;text-transform:none;width:;text-indent:0;padding-left:2px;padding-right:2px;border-width:1px;box-sizing:border-box',
     });
   });
 
@@ -168,9 +181,9 @@ describe('TextArea', () => {
   it('minRows or maxRows is not null', () => {
     const wrapper = document.createElement('textarea');
     expect(calculateNodeHeight(wrapper, 1, 1)).toEqual({
-      height: 0,
+      height: 2,
       maxHeight: 9007199254740991,
-      minHeight: -4,
+      minHeight: 2,
       overflowY: undefined,
     });
     wrapper.style.boxSizing = 'content-box';
diff --git a/components/input/calculateNodeHeight.tsx b/components/input/calculateNodeHeight.tsx
index c798421680..7b8fa9ca3c 100644
--- a/components/input/calculateNodeHeight.tsx
+++ b/components/input/calculateNodeHeight.tsx
@@ -93,6 +93,8 @@ export default function calculateNodeHeight(
 ) {
   if (!hiddenTextarea) {
     hiddenTextarea = document.createElement('textarea');
+    hiddenTextarea.setAttribute('tab-index', '-1');
+    hiddenTextarea.setAttribute('aria-hidden', 'true');
     document.body.appendChild(hiddenTextarea);
   }
 
diff --git a/components/slider/__tests__/index.test.js b/components/slider/__tests__/index.test.js
index e99c91fd06..0b192ffed3 100644
--- a/components/slider/__tests__/index.test.js
+++ b/components/slider/__tests__/index.test.js
@@ -4,10 +4,13 @@ import Slider from '..';
 import ConfigProvider from '../../config-provider';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
+import focusTest from '../../../tests/shared/focusTest';
+import { sleep } from '../../../tests/utils';
 
 describe('Slider', () => {
   mountTest(Slider);
   rtlTest(Slider);
+  focusTest(Slider);
 
   it('should show tooltip when hovering slider handler', () => {
     const wrapper = mount(<Slider defaultValue={30} />);
@@ -77,4 +80,11 @@ describe('Slider', () => {
     );
     expect(render(wrapper)).toMatchSnapshot();
   });
+
+  it('should keepAlign by calling forcePopupAlign', async () => {
+    const wrapper = mount(<Slider defaultValue={30} tooltipVisible />);
+    wrapper.find('Tooltip').instance().tooltip.forcePopupAlign = jest.fn();
+    await sleep(0);
+    expect(wrapper.find('Tooltip').instance().tooltip.forcePopupAlign).toHaveBeenCalled();
+  });
 });
diff --git a/tests/shared/focusTest.js b/tests/shared/focusTest.js
index 3630e080a5..f4c67a6bbb 100644
--- a/tests/shared/focusTest.js
+++ b/tests/shared/focusTest.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import { mount } from 'enzyme';
 import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
+import { sleep } from '../utils';
 
 // eslint-disable-next-line jest/no-export
 export default function focusTest(Component, refFocus = false) {
@@ -10,7 +11,6 @@ export default function focusTest(Component, refFocus = false) {
     let blurred = false;
 
     beforeAll(() => {
-      jest.useFakeTimers();
       if (refFocus) {
         domSpy = spyElementPrototypes(HTMLElement, {
           focus() {
@@ -35,7 +35,6 @@ export default function focusTest(Component, refFocus = false) {
       if (domSpy) {
         domSpy.mockRestore();
       }
-      jest.useRealTimers();
     });
 
     afterEach(() => {
@@ -99,20 +98,20 @@ export default function focusTest(Component, refFocus = false) {
         expect(handleFocus).toHaveBeenCalled();
       });
 
-      it('blur() and onBlur', () => {
+      it('blur() and onBlur', async () => {
+        jest.useRealTimers();
         const handleBlur = jest.fn();
         const wrapper = mount(<Component onBlur={handleBlur} />, { attachTo: container });
         wrapper.instance().focus();
-        jest.runAllTimers();
+        await sleep(0);
         wrapper.instance().blur();
-        jest.runAllTimers();
+        await sleep(0);
         expect(handleBlur).toHaveBeenCalled();
       });
 
       it('autoFocus', () => {
         const handleFocus = jest.fn();
         mount(<Component autoFocus onFocus={handleFocus} />, { attachTo: container });
-        jest.runAllTimers();
         expect(handleFocus).toHaveBeenCalled();
       });
     }