github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: slider marks class error

pull/2682/head
tangjinzhou 2020-08-03 22:38:35 +08:00
parent 64147e7744
commit 0a728ff8d3
5 changed files with 52 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
antdv-demo

@ -1 +1 @@
Subproject commit d76dd882c7b266a479533515b428c90b5630a92a Subproject commit fc551d5148a4b72ca5a8c119d3d141ec6190ffd9

46
components/slider/__tests__/__snapshots__/index.test.js.snap
View File

@ -1,22 +1,56 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Slider should show tooltip when hovering slider handler 1`] = ` exports[`Slider should show tooltip when hovering slider handler 1`] = `
<div id="app" data-v-app=""></div>
<div id="app" data-v-app="">
<div tabindex="-1" class="ant-slider">
<div class="ant-slider-rail"></div>
<div class="ant-slider-track" style="left: 0%; width: 30%;"></div>
<div class="ant-slider-step"></div>
<!--teleport start-->
<!--teleport end-->
<div class="ant-tooltip-open ant-slider-handle" style="left: 30%; transform: translateX(-50%);" role="slider" tabindex="0" aria-valuemin="0" aria-valuemax="100" aria-valuenow="30" aria-disabled="false"></div>
<div class=""></div>
</div>
</div>
<div style="position: absolute; top: 0px; left: 0px; width: 100%;">
<div> <div>
<div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top" style="left: -999px; top: -1003px; transform-origin: 50% 4px;"> <!---->
<div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top" style="left: -999px; top: -1003px;">
<div class="ant-tooltip-content"> <div class="ant-tooltip-content">
<div class="ant-tooltip-arrow"></div> <div class="ant-tooltip-arrow">
<div role="tooltip" class="ant-tooltip-inner">30</div> <!---->
</div>
<div class="ant-tooltip-inner" role="tooltip">30</div>
</div>
</div> </div>
</div> </div>
</div> </div>
`; `;
exports[`Slider should show tooltip when hovering slider handler 2`] = ` exports[`Slider should show tooltip when hovering slider handler 2`] = `
<div id="app" data-v-app=""></div>
<div id="app" data-v-app="">
<div tabindex="-1" class="ant-slider">
<div class="ant-slider-rail"></div>
<div class="ant-slider-track" style="left: 0%; width: 30%;"></div>
<div class="ant-slider-step"></div>
<!--teleport start-->
<!--teleport end-->
<div class="ant-slider-handle" style="left: 30%; transform: translateX(-50%);" role="slider" tabindex="0" aria-valuemin="0" aria-valuemax="100" aria-valuenow="30" aria-disabled="false"></div>
<div class=""></div>
</div>
</div>
<div style="position: absolute; top: 0px; left: 0px; width: 100%;">
<div> <div>
<div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top" style="display: none;"> <!---->
<div class="ant-tooltip ant-slider-tooltip ant-tooltip-placement-top zoom-down-leave" style="left: -999px; top: -1003px;">
<div class="ant-tooltip-content"> <div class="ant-tooltip-content">
<div class="ant-tooltip-arrow"></div> <div class="ant-tooltip-arrow">
<div role="tooltip" class="ant-tooltip-inner">30</div> <!---->
</div>
<div class="ant-tooltip-inner" role="tooltip">30</div>
</div>
</div> </div>
</div> </div>
</div> </div>

36
components/slider/__tests__/index.test.js
View File

@ -11,43 +11,17 @@ describe('Slider', () => {
defaultValue: 30, defaultValue: 30,
}, },
sync: false, sync: false,
attachTo: 'body',
}); });
await asyncExpect(() => { await asyncExpect(() => {
wrapper wrapper.findAll('.ant-slider-handle')[0].trigger('mouseenter');
.findAll('.ant-slider-handle')
.at(0)
.trigger('mouseenter');
});
let dropdownWrapper = null;
await asyncExpect(() => {
dropdownWrapper = mount(
{
render() {
return wrapper.find({ name: 'Trigger' }).vm.getComponent();
},
},
{ sync: false },
);
}); });
await asyncExpect(() => { await asyncExpect(() => {
expect(dropdownWrapper.html()).toMatchSnapshot(); expect(document.body.innerHTML).toMatchSnapshot();
wrapper wrapper.findAll('.ant-slider-handle')[0].trigger('mouseleave');
.findAll('.ant-slider-handle')
.at(0)
.trigger('mouseleave');
}); });
await asyncExpect(() => { await asyncExpect(() => {
dropdownWrapper = mount( expect(document.body.innerHTML).toMatchSnapshot();
{
render() {
return wrapper.find({ name: 'Trigger' }).vm.getComponent();
},
},
{ sync: false },
);
});
await asyncExpect(() => {
expect(dropdownWrapper.html()).toMatchSnapshot();
}); });
}); });
}); });

2
components/vc-slider/src/common/Marks.jsx
View File

@ -3,7 +3,7 @@ import { isValidElement } from '../../../_util/props-util';
const Marks = (_, { attrs }) => { const Marks = (_, { attrs }) => {
const { const {
className, class: className,
vertical, vertical,
reverse, reverse,
marks, marks,

2
examples/App.vue
View File

@ -4,7 +4,7 @@
</div> </div>
</template> </template>
<script> <script>
import demo from '../antdv-demo/docs/spin/demo/index'; import demo from '../antdv-demo/docs/slider/demo/index';
export default { export default {
components: { components: {