test(NavBar): update test cases

src/nav-bar/index.tsx

@@ -58,9 +58,7 @@ export default createComponent({
         return slots.right();
       }
 
-      if (props.rightText) {
-        return <span class={bem('text')}>{props.rightText}</span>;
-      }
+      return <span class={bem('text')}>{props.rightText}</span>;
     };
 
     const renderNavBar = () => {

src/nav-bar/test/__snapshots__/index.legacy.js.snap

@@ -1,29 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`should render left/right slot and match snapshot 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[`should render placeholder element when using 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>
-`;
-
-exports[`should render title slot and match snapshot 1`] = `
-<div class="van-nav-bar van-hairline--bottom">
-  <div class="van-nav-bar__content">
-    <div class="van-nav-bar__title van-ellipsis">Custom Title</div>
-  </div>
-</div>
-`;

src/nav-bar/test/__snapshots__/index.spec.js.snap

@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render left slot correctly 1`] = `<div class="van-nav-bar__left">Custom Left</div>`;
+
+exports[`should render left slot correctly 2`] = `<div class="van-nav-bar__right">Custom Right</div>`;
+
+exports[`should render placeholder element when using 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>
+`;
+
+exports[`should render title slot correctly 1`] = `<div class="van-nav-bar__title van-ellipsis">Custom Title</div>`;

src/nav-bar/test/index.spec.js

@@ -1,30 +1,38 @@
 import NavBar from '..';
-import { mount, mockGetBoundingClientRect } from '../../../test';
+import { mount, mockGetBoundingClientRect, later } from '../../../test';
 
-test('should render left/right slot and match snapshot', () => {
+test('should render left slot correctly', () => {
   const wrapper = mount(NavBar, {
     slots: {
       left: () => 'Custom Left',
+    },
+  });
+
+  expect(wrapper.find('.van-nav-bar__left').html()).toMatchSnapshot();
+});
+
+test('should render left slot correctly', () => {
+  const wrapper = mount(NavBar, {
+    slots: {
       right: () => 'Custom Right',
     },
   });
 
-  expect(wrapper.html()).toMatchSnapshot();
+  expect(wrapper.find('.van-nav-bar__right').html()).toMatchSnapshot();
 });
 
-test('should render title slot and match snapshot', () => {
+test('should render title slot correctly', () => {
   const wrapper = mount(NavBar, {
     slots: {
       title: () => 'Custom Title',
     },
   });
 
-  expect(wrapper.html()).toMatchSnapshot();
+  expect(wrapper.find('.van-nav-bar__title').html()).toMatchSnapshot();
 });
 
-test('should render placeholder element when using placeholder prop', () => {
+test('should render placeholder element when using placeholder prop', async () => {
   const restore = mockGetBoundingClientRect({ height: 50 });
-
   const wrapper = mount(NavBar, {
     props: {
       fixed: true,
@@ -32,8 +40,8 @@ test('should render placeholder element when using placeholder prop', () => {
     },
   });
 
+  await later();
   expect(wrapper.html()).toMatchSnapshot();
-
   restore();
 });
 
@@ -66,5 +74,16 @@ test('should have safe-area-inset-top class when using safe-area-inset-top prop'
     },
   });
 
-  expect(wrapper.contains('.van-nav-bar--safe-area-inset-top')).toBeTruthy();
+  expect(
+    wrapper.find('.van-nav-bar--safe-area-inset-top').exists()
+  ).toBeTruthy();
+});
+
+test('should change z-index when using z-index prop', () => {
+  const wrapper = mount(NavBar, {
+    props: {
+      zIndex: 100,
+    },
+  });
+  expect(wrapper.element.style.zIndex).toEqual('100');
 });