IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

scrollbar: use enzyme for tests instead of react-test-renderer

Browse Source
This commit is contained in:
Alexander Zobnin 2018-09-07 14:31:56 +03:00
parent 729cc94daf
commit 349b2787cb
No known key found for this signature in database
GPG Key ID: E17E9ABACEFA59EB
2 changed files with 111 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
public/app/core/components/ScrollBar/GrafanaScrollbar.test.tsx
View File

@ -1,16 +1,15 @@
import React from 'react';
import renderer from 'react-test-renderer';
import { mount } from 'enzyme';
import toJson from 'enzyme-to-json';
import GrafanaScrollbar from './GrafanaScrollbar';
describe('GrafanaScrollbar', () => {
it('renders correctly', () => {
const tree = renderer
.create(
<GrafanaScrollbar>
<p>Scrollable content</p>
</GrafanaScrollbar>
)
.toJSON();
expect(tree).toMatchSnapshot();
const tree = mount(
<GrafanaScrollbar>
<p>Scrollable content</p>
</GrafanaScrollbar>
);
expect(toJson(tree)).toMatchSnapshot();
});
});

176
public/app/core/components/ScrollBar/__snapshots__/GrafanaScrollbar.test.tsx.snap
View File

@ -1,86 +1,116 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`GrafanaScrollbar renders correctly 1`] = `
<div
className="custom-scrollbars"
style={
Object {
"height": "auto",
"maxHeight": "100%",
"minHeight": "100%",
"overflow": "hidden",
"position": "relative",
"width": "100%",
}
}
<GrafanaScrollbar
autoHide={true}
autoHideDuration={200}
autoHideTimeout={200}
customClassName="custom-scrollbars"
hideTracksWhenNotNeeded={false}
>
<div
className="view"
style={
Object {
"WebkitOverflowScrolling": "touch",
"bottom": undefined,
"left": undefined,
"marginBottom": 0,
"marginRight": 0,
"maxHeight": "calc(100% + 0px)",
"minHeight": "calc(100% + 0px)",
"overflow": "scroll",
"position": "relative",
"right": undefined,
"top": undefined,
}
}
>
<p>
Scrollable content
</p>
</div>
<div
className="track-horizontal"
style={
Object {
"display": "none",
"height": 6,
"opacity": 0,
"position": "absolute",
"transition": "opacity 200ms",
}
}
<Scrollbars
autoHeight={true}
autoHeightMax="100%"
autoHeightMin="100%"
autoHide={true}
autoHideDuration={200}
autoHideTimeout={200}
className="custom-scrollbars"
hideTracksWhenNotNeeded={false}
renderThumbHorizontal={[Function]}
renderThumbVertical={[Function]}
renderTrackHorizontal={[Function]}
renderTrackVertical={[Function]}
renderView={[Function]}
tagName="div"
thumbMinSize={30}
universal={false}
>
<div
className="thumb-horizontal"
className="custom-scrollbars"
style={
Object {
"display": "block",
"height": "100%",
"position": "relative",
}
}
/>
</div>
<div
className="track-vertical"
style={
Object {
"display": "none",
"opacity": 0,
"position": "absolute",
"transition": "opacity 200ms",
"width": 6,
}
}
>
<div
className="thumb-vertical"
style={
Object {
"display": "block",
"height": "auto",
"maxHeight": "100%",
"minHeight": "100%",
"overflow": "hidden",
"position": "relative",
"width": "100%",
}
}
/>
</div>
</div>
>
<div
className="view"
key="view"
style={
Object {
"WebkitOverflowScrolling": "touch",
"bottom": undefined,
"left": undefined,
"marginBottom": 0,
"marginRight": 0,
"maxHeight": "calc(100% + 0px)",
"minHeight": "calc(100% + 0px)",
"overflow": "scroll",
"position": "relative",
"right": undefined,
"top": undefined,
}
}
>
<p>
Scrollable content
</p>
</div>
<div
className="track-horizontal"
key="trackHorizontal"
style={
Object {
"display": "none",
"height": 6,
"opacity": 0,
"position": "absolute",
"transition": "opacity 200ms",
}
}
>
<div
className="thumb-horizontal"
style={
Object {
"display": "block",
"height": "100%",
"position": "relative",
}
}
/>
</div>
<div
className="track-vertical"
key="trackVertical"
style={
Object {
"display": "none",
"opacity": 0,
"position": "absolute",
"transition": "opacity 200ms",
"width": 6,
}
}
>
<div
className="thumb-vertical"
style={
Object {
"display": "block",
"position": "relative",
"width": "100%",
}
}
/>
</div>
</div>
</Scrollbars>
</GrafanaScrollbar>
`;