alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat(NavBar): add safe-area-inset-top prop

Browse Source
This commit is contained in:
chenjiahan
2020-11-08 16:19:18 +08:00
committed by neverland
parent f07d8e6709
commit be25a478df
6 changed files with 79 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/nav-bar/test/__snapshots__/index.spec.js.snap
+16 -10
View File
@@ -1,23 +1,29 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`placeholder prop 1`] = `
<div class="van-nav-bar__placeholder" style="height: 50px;">
<div class="van-nav-bar van-nav-bar--fixed van-hairline--bottom">
exports[`should allow render left/right slot 1`] = `
<div class="van-nav-bar van-hairline--bottom">
<div class="van-nav-bar__content">
<div class="van-nav-bar__left">Custom Left</div>
<div class="van-nav-bar__title van-ellipsis"></div>
<div class="van-nav-bar__right">Custom Right</div>
</div>
</div>
`;
exports[`render left & right slot 1`] = `
exports[`should allow render title slot 1`] = `
<div class="van-nav-bar van-hairline--bottom">
<div class="van-nav-bar__left">Custom Left</div>
<div class="van-nav-bar__title van-ellipsis"></div>
<div class="van-nav-bar__right">Custom Right</div>
<div class="van-nav-bar__content">
<div class="van-nav-bar__title van-ellipsis">Custom Title</div>
</div>
</div>
`;
exports[`render title slot 1`] = `
<div class="van-nav-bar van-hairline--bottom">
<div class="van-nav-bar__title van-ellipsis">Custom Title</div>
exports[`should render placeholder element when enabling placeholder prop 1`] = `
<div class="van-nav-bar__placeholder" style="height: 50px;">
<div class="van-nav-bar van-nav-bar--fixed van-hairline--bottom">
<div class="van-nav-bar__content">
<div class="van-nav-bar__title van-ellipsis"></div>
</div>
</div>
</div>
`;
src/nav-bar/test/index.spec.js
+15 -5
View File
@@ -1,7 +1,7 @@
import NavBar from '..';
import { mount, mockGetBoundingClientRect } from '../../../test';
test('render left & right slot', () => {
test('should allow render left/right slot', () => {
const wrapper = mount(NavBar, {
scopedSlots: {
left: () => 'Custom Left',
@@ -12,7 +12,7 @@ test('render left & right slot', () => {
expect(wrapper).toMatchSnapshot();
});
test('render title slot', () => {
test('should allow render title slot', () => {
const wrapper = mount(NavBar, {
scopedSlots: {
title: () => 'Custom Title',
@@ -22,7 +22,7 @@ test('render title slot', () => {
expect(wrapper).toMatchSnapshot();
});
test('placeholder prop', () => {
test('should render placeholder element when enabling placeholder prop', () => {
const restore = mockGetBoundingClientRect({ height: 50 });
const wrapper = mount(NavBar, {
@@ -37,7 +37,7 @@ test('placeholder prop', () => {
restore();
});
test('click-left event', () => {
test('should emit click-left event when clicking left text', () => {
const wrapper = mount(NavBar, {
propsData: {
leftText: 'left',
@@ -48,7 +48,7 @@ test('click-left event', () => {
expect(wrapper.emitted('click-left')).toBeTruthy();
});
test('click-right event', () => {
test('should emit click-right event when clicking right text', () => {
const wrapper = mount(NavBar, {
propsData: {
rightText: 'right',
@@ -58,3 +58,13 @@ test('click-right event', () => {
wrapper.find('.van-nav-bar__right').trigger('click');
expect(wrapper.emitted('click-right')).toBeTruthy();
});
test('should add safe-area-inset-top classname when using safe-area-inset-top prop', () => {
const wrapper = mount(NavBar, {
propsData: {
safeAreaInsetTop: true,
},
});
expect(wrapper.contains('.van-nav-bar--safe-area-inset-top')).toBeTruthy();
});