Skip to content

Commit

Permalink
test(video): add snapshot
Browse files Browse the repository at this point in the history
  • Loading branch information
richard1015 committed Mar 24, 2022
1 parent cd40bbd commit dfe4604
Show file tree
Hide file tree
Showing 3 changed files with 39 additions and 43 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@
"generate:types": "node jd/generate-types.js",
"generate:themes": "node jd/generate-themes.js",
"prepare": "husky install",
"test": "jest --watchAll",
"test": "jest",
"release": "standard-version -a",
"codeformat": "prettier --write .",
"copydocs": "node ./jd/copymd.js"
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Video video base info 1`] = `
"<div class=\\"nut-video\\"><video class=\\"nut-video-player\\" autoplay=\\"\\" loop=\\"\\" controls=\\"\\" playsinline=\\"true\\" webkit-playsinline=\\"true\\" x5-video-player-type=\\"h5-page\\" x5-video-player-fullscreen=\\"false\\">
<source src=\\"xxx.mp4\\" type=\\"video/mp4\\">
</video>
<!--v-if-->
<!--v-if-->
<div class=\\"nut-video-controller show-control\\" style=\\"display: none;\\">
<div class=\\"control-play-btn\\"></div>
<div class=\\"current-time\\">00:00</div>
<div class=\\"progress-container\\">
<div class=\\"progress\\">
<div class=\\"buffered\\" style=\\"width: 0%;\\"></div>
<div class=\\"video-ball\\" style=\\"transform: translate3d(0px, -50%, 0);\\">
<div class=\\"move-handle\\"></div>
</div>
<div class=\\"played\\"></div>
</div>
</div>
<div class=\\"duration-time\\">00:00</div>
<div class=\\"volume muted\\"></div>
<div class=\\"fullscreen-icon\\"></div>
</div><!-- 错误弹窗 -->
<div class=\\"nut-video-error\\" style=\\"display: none;\\">
<p class=\\"lose\\">视频加载失败</p>
<p class=\\"retry\\">点击重试</p>
</div>
</div>"
`;
50 changes: 8 additions & 42 deletions src/packages/__VUE/video/__tests__/video.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,59 +2,25 @@ import { mount } from '@vue/test-utils';
import Video from '../index.vue';

describe('Video', () => {
test('base Video', () => {
const wrapper = mount(Video);
const rate = wrapper.find('.nut-video');
expect(rate.exists()).toBe(true);
});
test('should be displayed after setting the source src and type', () => {
test('video base info', () => {
const wrapper = mount(Video, {
props: {
source: {
src: 'xxx.mp4',
type: 'video/mp4'
type: 'video/mp4',
poster:
'https://img12.360buyimg.com/ling/s345x208_jfs/t1/168105/33/8417/54825/603df06dEfcddc4cb/21f9f5d0a1b3dad4.jpg.webp'
},
options: {
controls: true
}
}
});
expect(wrapper.html()).toContain('src');
expect(wrapper.html()).toContain('type');
expect(wrapper.html()).toContain('controls');
});
test('should be displayed after setting the options autoplay and muted and loop', () => {
const wrapper = mount(Video, {
props: {
options: {
controls: true,
autoplay: true,
muted: true,
playsinline: true,
loop: true
}
}
});
expect(wrapper.html()).toContain('autoplay');
expect(wrapper.html()).toContain('muted');
expect(wrapper.html()).toContain('loop');
});
test('should be displayed after setting the options poster and playsinline', () => {
const wrapper = mount(Video, {
props: {
options: {
poster: 'xxx.png',
playsinline: true
}
}
});
expect(wrapper.html()).toContain('xxx.png');
expect(wrapper.html()).toContain('playsinline');
});
test('should be displayed after setting the click', () => {
const wrapper = mount(Video);
const _html1 = wrapper.find('.show-control');
expect(_html1.exists()).toBe(true);
wrapper.find('.control-play-btn').trigger('click');
const _html2 = wrapper.find('.hide-control');
expect(_html2.exists()).toBe(false);
expect(wrapper.find<HTMLElement>('.nut-video source').html()).toContain('xxx.mp4');
expect(wrapper.html()).toMatchSnapshot();
});
});

0 comments on commit dfe4604

Please sign in to comment.