From 76ba7d1f8cf2d3351d6be7f2567d4394a27fadb7 Mon Sep 17 00:00:00 2001 From: Johannes Schill Date: Thu, 21 Dec 2017 10:30:03 +0100 Subject: [PATCH] test: Add snapshot tests for UserPicker and UserPickerOption (#10289) --- .../EmptyListCTA/EmptyListCTA.jest.tsx | 21 ++-- .../__snapshots__/EmptyListCTA.jest.tsx.snap | 2 +- .../components/UserPicker/UserPicker.jest.tsx | 20 ++++ .../UserPicker/UserPickerOption.jest.tsx | 22 +++++ .../UserPicker/UserPickerOption.tsx | 10 +- .../__snapshots__/UserPicker.jest.tsx.snap | 98 +++++++++++++++++++ .../UserPickerOption.jest.tsx.snap | 17 ++++ 7 files changed, 172 insertions(+), 18 deletions(-) create mode 100644 public/app/core/components/UserPicker/UserPicker.jest.tsx create mode 100644 public/app/core/components/UserPicker/UserPickerOption.jest.tsx create mode 100644 public/app/core/components/UserPicker/__snapshots__/UserPicker.jest.tsx.snap create mode 100644 public/app/core/components/UserPicker/__snapshots__/UserPickerOption.jest.tsx.snap diff --git a/public/app/core/components/EmptyListCTA/EmptyListCTA.jest.tsx b/public/app/core/components/EmptyListCTA/EmptyListCTA.jest.tsx index d62ae892a0a..4af60f3c839 100644 --- a/public/app/core/components/EmptyListCTA/EmptyListCTA.jest.tsx +++ b/public/app/core/components/EmptyListCTA/EmptyListCTA.jest.tsx @@ -3,19 +3,18 @@ import renderer from 'react-test-renderer'; import EmptyListCTA from './EmptyListCTA'; const model = { - title: 'Title', - buttonIcon: 'ga css class', - buttonLink: 'http://url/to/destination', - buttonTitle: 'Click me', - proTip: 'This is a tip', - proTipLink: 'http://url/to/tip/destination', - proTipLinkTitle: 'Learn more', - proTipTarget: '_blank' + title: 'Title', + buttonIcon: 'ga css class', + buttonLink: 'http://url/to/destination', + buttonTitle: 'Click me', + proTip: 'This is a tip', + proTipLink: 'http://url/to/tip/destination', + proTipLinkTitle: 'Learn more', + proTipTarget: '_blank', }; -describe('CollorPalette', () => { - - it('renders correctly', () => { +describe('EmptyListCTA', () => { + it('renders correctly', () => { const tree = renderer.create().toJSON(); expect(tree).toMatchSnapshot(); }); diff --git a/public/app/core/components/EmptyListCTA/__snapshots__/EmptyListCTA.jest.tsx.snap b/public/app/core/components/EmptyListCTA/__snapshots__/EmptyListCTA.jest.tsx.snap index 0da3d94aaa8..6d47c984d5e 100644 --- a/public/app/core/components/EmptyListCTA/__snapshots__/EmptyListCTA.jest.tsx.snap +++ b/public/app/core/components/EmptyListCTA/__snapshots__/EmptyListCTA.jest.tsx.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`CollorPalette renders correctly 1`] = ` +exports[`EmptyListCTA renders correctly 1`] = `
diff --git a/public/app/core/components/UserPicker/UserPicker.jest.tsx b/public/app/core/components/UserPicker/UserPicker.jest.tsx new file mode 100644 index 00000000000..0e3c672dcbe --- /dev/null +++ b/public/app/core/components/UserPicker/UserPicker.jest.tsx @@ -0,0 +1,20 @@ +import React from 'react'; +import renderer from 'react-test-renderer'; +import UserPicker from './UserPicker'; + +const model = { + backendSrv: { + get: () => { + return new Promise((resolve, reject) => {}); + }, + }, + refreshList: () => {}, + teamId: '1', +}; + +describe('UserPicker', () => { + it('renders correctly', () => { + const tree = renderer.create().toJSON(); + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/public/app/core/components/UserPicker/UserPickerOption.jest.tsx b/public/app/core/components/UserPicker/UserPickerOption.jest.tsx new file mode 100644 index 00000000000..6903d648870 --- /dev/null +++ b/public/app/core/components/UserPicker/UserPickerOption.jest.tsx @@ -0,0 +1,22 @@ +import React from 'react'; +import renderer from 'react-test-renderer'; +import UserPickerOption from './UserPickerOption'; + +const model = { + onSelect: () => {}, + onFocus: () => {}, + isFocused: () => {}, + option: { + title: 'Model title', + avatarUrl: 'url/to/avatar', + label: 'User picker label', + }, + className: 'class-for-user-picker', +}; + +describe('UserPickerOption', () => { + it('renders correctly', () => { + const tree = renderer.create().toJSON(); + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/public/app/core/components/UserPicker/UserPickerOption.tsx b/public/app/core/components/UserPicker/UserPickerOption.tsx index c052631d295..42a079802a8 100644 --- a/public/app/core/components/UserPicker/UserPickerOption.tsx +++ b/public/app/core/components/UserPicker/UserPickerOption.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import React, { Component } from 'react'; export interface IProps { onSelect: any; onFocus: any; @@ -19,9 +19,11 @@ class UserPickerOption extends Component { event.stopPropagation(); this.props.onSelect(this.props.option, event); } + handleMouseEnter(event) { this.props.onFocus(this.props.option, event); } + handleMouseMove(event) { if (this.props.isFocused) { return; @@ -40,11 +42,7 @@ class UserPickerOption extends Component { title={option.title} className={`user-picker-option__button btn btn-link ${className}`} > - {option.label} + {option.label} {children} ); diff --git a/public/app/core/components/UserPicker/__snapshots__/UserPicker.jest.tsx.snap b/public/app/core/components/UserPicker/__snapshots__/UserPicker.jest.tsx.snap new file mode 100644 index 00000000000..e0d6f2a9a11 --- /dev/null +++ b/public/app/core/components/UserPicker/__snapshots__/UserPicker.jest.tsx.snap @@ -0,0 +1,98 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`UserPicker renders correctly 1`] = ` +
+
+
+ +
+ Loading... +
+
+ +
+ +
+
+
+
+
+
+`; diff --git a/public/app/core/components/UserPicker/__snapshots__/UserPickerOption.jest.tsx.snap b/public/app/core/components/UserPicker/__snapshots__/UserPickerOption.jest.tsx.snap new file mode 100644 index 00000000000..3b9351b2338 --- /dev/null +++ b/public/app/core/components/UserPicker/__snapshots__/UserPickerOption.jest.tsx.snap @@ -0,0 +1,17 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`UserPickerOption renders correctly 1`] = ` + +`;