[new feature] add Notify component (#2135)

packages/notify/test/__snapshots__/demo.spec.js.snap

@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders demo correctly 1`] = `
+<div>
+  <div>
+    <button class="van-button van-button--default van-button--normal"><span class="van-button__text">显示消息通知</span></button>
+  </div>
+  <div>
+    <button class="van-button van-button--default van-button--normal"><span class="van-button__text">显示自定义消息通知</span></button>
+  </div>
+</div>
+`;

packages/notify/test/__snapshots__/index.spec.js.snap

@@ -0,0 +1,31 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`create a notify 1`] = `
+<div class="van-notify" style="color: rgb(255, 255, 255); background: rgb(255, 68, 68); z-index: 2000;" name="van-slide-down">
+  test
+</div>
+`;
+
+exports[`notify disappear 1`] = `
+<div class="van-notify" style="color: red; z-index: 2000; background: blue;" name="van-slide-down">
+  test
+</div>
+`;
+
+exports[`notify disappear 2`] = `
+<div class="van-notify" style="color: red; z-index: 2000; background: blue; display: none;" name="van-slide-down">
+  test
+</div>
+`;
+
+exports[`notify disappear 3`] = `
+<div class="van-notify" style="color: rgb(255, 255, 255); z-index: 2001; background: rgb(255, 68, 68);" name="van-slide-down">
+  text2
+</div>
+`;
+
+exports[`notify disappear 4`] = `
+<div class="van-notify" style="color: rgb(255, 255, 255); z-index: 2001; background: rgb(255, 68, 68); display: none;" name="van-slide-down">
+  text2
+</div>
+`;

packages/notify/test/demo.spec.js

@@ -0,0 +1,4 @@
+import Demo from '../demo';
+import demoTest from '../../../test/demo-test';
+
+demoTest(Demo);

packages/notify/test/index.spec.js

@@ -0,0 +1,49 @@
+import Notify from '../';
+import { transitionStub, later } from '../../../test/utils';
+
+transitionStub();
+
+test('create a notify', async() => {
+  // should not cause error when call clear before show notify
+  Notify.clear();
+
+  const notify = Notify('test');
+
+  await later();
+  expect(notify.$el.outerHTML).toMatchSnapshot();
+});
+
+test('notify disappear', async() => {
+  const notify = Notify({
+    message: 'test',
+    color: 'red',
+    background: 'blue',
+    duration: 10
+  });
+
+  await later();
+  expect(notify.$el.outerHTML).toMatchSnapshot();
+
+  await later(20);
+  expect(notify.$el.outerHTML).toMatchSnapshot();
+
+  Notify({
+    message: 'text2',
+    duration: 0
+  });
+
+  await later();
+  expect(notify.$el.outerHTML).toMatchSnapshot();
+
+  Notify.clear();
+  await later();
+  expect(notify.$el.outerHTML).toMatchSnapshot();
+});
+
+test('set default options', () => {
+  Notify.setDefaultOptions({ duration: 1000 });
+  expect(Notify().duration).toEqual(1000);
+  Notify.resetDefaultOptions();
+  expect(Notify().duration).toEqual(3000);
+  Notify.clear();
+});