Browse Source

fix: percent={(3 / 9) * 100} steps={9} shows 2 (#28530)

* 🐛  fix bug: percent={(3 / 9) * 100} steps={9} shows 2

*  add test for last commit

*  update jest snapshot

*  add test
pull/28585/head
gaoryrt 4 years ago
committed by GitHub
parent
commit
d769795aa0
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 2
      components/progress/Steps.tsx
  2. 4
      components/progress/__tests__/__snapshots__/demo.test.js.snap
  3. 9
      components/progress/__tests__/index.test.js

2
components/progress/Steps.tsx

@ -20,7 +20,7 @@ const Steps: React.FC<StepsProps> = props => {
prefixCls, prefixCls,
children, children,
} = props; } = props;
const current = Math.floor(steps * (percent / 100)); const current = Math.round(steps * (percent / 100));
const stepWidth = size === 'small' ? 2 : 14; const stepWidth = size === 'small' ? 2 : 14;
const styledSteps = []; const styledSteps = [];
for (let i = 0; i < steps; i += 1) { for (let i = 0; i < steps; i += 1) {

4
components/progress/__tests__/__snapshots__/demo.test.js.snap

@ -1415,7 +1415,7 @@ Array [
style="width:14px;height:8px" style="width:14px;height:8px"
/> />
<div <div
class="ant-progress-steps-item" class="ant-progress-steps-item ant-progress-steps-item-active"
style="width:14px;height:8px" style="width:14px;height:8px"
/> />
<div <div
@ -1442,7 +1442,7 @@ Array [
style="width:14px;height:8px" style="width:14px;height:8px"
/> />
<div <div
class="ant-progress-steps-item" class="ant-progress-steps-item ant-progress-steps-item-active"
style="width:14px;height:8px" style="width:14px;height:8px"
/> />
<div <div

9
components/progress/__tests__/index.test.js

@ -175,6 +175,15 @@ describe('Progress', () => {
); );
}); });
it('should display correct step', () => {
const wrapper = mount(<Progress steps={9} percent={22.22} />);
expect(wrapper.find('.ant-progress-steps-item-active').length).toBe(2);
wrapper.setProps({ percent: 33.33 });
expect(wrapper.find('.ant-progress-steps-item-active').length).toBe(3);
wrapper.setProps({ percent: 44.44 });
expect(wrapper.find('.ant-progress-steps-item-active').length).toBe(4);
});
it('steps should have default percent 0', () => { it('steps should have default percent 0', () => {
const wrapper = mount(<ProgressSteps />); const wrapper = mount(<ProgressSteps />);
expect(wrapper.render()).toMatchSnapshot(); expect(wrapper.render()).toMatchSnapshot();

Loading…
Cancel
Save