mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-28 05:05:48 +08:00
Code Issues Actions 43 Packages Projects Releases Wiki Activity

fix: Progress steps support trailColor (#26323)

Browse Source 
* fix: Progress steps support trailColor

close #26316

* add test case

* add test case
This commit is contained in:
偏右 2020-08-22 01:29:48 +08:00 committed by GitHub
parent 63816fa6ba
commit d839cb1af9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 31 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
components/progress/Steps.tsx
View File

@ -6,10 +6,20 @@ interface StepsProps extends ProgressProps {
steps: number;
size?: ProgressSize;
strokeColor?: string;
trailColor?: string;
}
const Steps: React.FC<StepsProps> = props => {
const { size, steps, percent = 0, strokeWidth = 8, strokeColor, prefixCls, children } = props;
const {
size,
steps,
percent = 0,
strokeWidth = 8,
strokeColor,
trailColor,
prefixCls,
children,
} = props;
const current = Math.floor(steps * (percent / 100));
const stepWidth = size === 'small' ? 2 : 14;
const styledSteps = [];
@ -21,7 +31,7 @@ const Steps: React.FC<StepsProps> = props => {
[`${prefixCls}-steps-item-active`]: i <= current - 1,
})}
style={{
backgroundColor: i <= current - 1 ? strokeColor : undefined,
backgroundColor: i <= current - 1 ? strokeColor : trailColor,
width: stepWidth,
height: strokeWidth,
}}

6
components/progress/__tests__/__snapshots__/index.test.js.snap
View File

@ -608,3 +608,9 @@ exports[`Progress should support steps 1`] = `
</div>
</div>
`;
exports[`Progress steps should have default percent 0 1`] = `
<div
class="undefined-steps-outer"
/>
`;

13
components/progress/__tests__/index.test.js
View File

@ -2,6 +2,7 @@ import React from 'react';
import { mount } from 'enzyme';
import Progress from '..';
import { handleGradient, sortGradient } from '../Line';
import ProgressSteps from '../Steps';
import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest';
@ -167,6 +168,18 @@ describe('Progress', () => {
);
});
it('steps should support trailColor', () => {
const wrapper = mount(<Progress steps={5} percent={20} trailColor="#1890ee" />);
expect(wrapper.find('.ant-progress-steps-item').at(1).getDOMNode().style.backgroundColor).toBe(
'rgb(24, 144, 238)',
);
});
it('steps should have default percent 0', () => {
const wrapper = mount(<ProgressSteps />);
expect(wrapper.render()).toMatchSnapshot();
});
it('should warnning if use `progress` in success', () => {
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
mount(<Progress percent={60} success={{ progress: 30 }} />);