Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: annotation marker size calculation #960

Merged
merged 13 commits into from
Jan 26, 2021
Merged

refactor: annotation marker size calculation #960

Show file tree
Hide file tree
Changes from 8 commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
d367016
refactor: annotation marker size calculation
markov00 Jan 4, 2021
efa6ad9
refactor: cleanup code
markov00 Jan 4, 2021
befc762
test: update screenshots and api report
markov00 Jan 4, 2021
69b66a8
Merge branch 'master' into 2020_12_27-feat_react_reconciler_pt1
markov00 Jan 19, 2021
5919ef2
refactor: remove unnecessary anchor position field
markov00 Jan 25, 2021
7751837
refactor: improve annotation props id generation
markov00 Jan 25, 2021
7465bb3
refactor: code changes from reviews
markov00 Jan 25, 2021
e5532d0
Merge branch 'master' into 2020_12_27-feat_react_reconciler_pt1
markov00 Jan 25, 2021
a6ff0b8
refactor: export annotation line props id fn
markov00 Jan 25, 2021
10e6ca5
refactor: cleanup types
markov00 Jan 25, 2021
50eeeb4
Merge branch 'master' into 2020_12_27-feat_react_reconciler_pt1
markov00 Jan 25, 2021
4ca4147
test: fix screenshot test on small multiple
markov00 Jan 26, 2021
e832bf4
Merge branch 'master' into 2020_12_27-feat_react_reconciler_pt1
markov00 Jan 26, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions api/charts.api.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -435,6 +435,7 @@ export type CurveType = $Values<typeof CurveType>;
export type CustomAnnotationTooltip = ComponentType<{
header?: string;
details?: string;
datum: LineAnnotationDatum | RectAnnotationDatum;
}> | null;

// @public
Expand Down
Binary file modified ...ts-for-all-stories-annotations-lines-y-domain-visually-looks-correct-1-snap.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...stories-small-multiples-alpha-horizontal-bars-visually-looks-correct-1-snap.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 0 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,6 @@
"d3-scale": "^1.0.7",
"d3-shape": "^1.3.4",
"newtype-ts": "^0.2.4",
"path2d-polyfill": "^0.4.2",
markov00 marked this conversation as resolved.
Show resolved Hide resolved
"prop-types": "^15.7.2",
"re-reselect": "^3.4.0",
"react-redux": "^7.1.0",
Expand Down
5 changes: 5 additions & 0 deletions scripts/setup_enzyme.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,3 +60,8 @@ class ResizeObserverMock {
}

window.ResizeObserver = ResizeObserverMock;

// Some tests will fail due to undefined Path2D, this mock doesn't create issues on test env
class Path2D {}
// @ts-ignore
window.Path2D = Path2D;
8 changes: 6 additions & 2 deletions src/chart_types/xy_chart/annotations/line/dimensions.integration.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,10 @@ function expectAnnotationAtPosition(
const annotations = computeAnnotationDimensionsSelector(store.getState());
expect(annotations.get(annotation.id)).toEqual([
MockAnnotationLineProps.default({
details: { detailsText: undefined, headerText: `${indexPosition}` },
specId: 'line_annotation_1',
datum: {
dataValue: indexPosition,
},
linePathPoints: {
x1: expectedLinePosition,
y1: 0,
Expand Down Expand Up @@ -147,13 +150,14 @@ describe('Render vertical line annotation within', () => {
const annotations = computeAnnotationDimensionsSelector(store.getState());
expect(annotations.get(annotation.id)).toEqual([
MockAnnotationLineProps.default({
specId: 'line_annotation_1',
linePathPoints: {
x1: 95,
y1: 0,
x2: 95,
y2: 100,
},
details: { detailsText: 'foo', headerText: '9.5' },
datum: { dataValue: 9.5, details: 'foo' },
}),
]);
});
Expand Down
44 changes: 28 additions & 16 deletions src/chart_types/xy_chart/annotations/line/dimensions.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
* under the License.
*/

import { MockAnnotationLineProps } from '../../../../mocks/annotations/annotations';
import { MockAnnotationLineProps, MockAnnotationRectProps } from '../../../../mocks/annotations/annotations';
import { MockAnnotationSpec, MockGlobalSpec, MockSeriesSpec } from '../../../../mocks/specs';
import { MockStore } from '../../../../mocks/store';
import { ScaleType } from '../../../../scales/constants';
Expand Down Expand Up @@ -88,21 +88,22 @@ describe('Annotation utils', () => {
const expectedDimensions = new Map<AnnotationId, AnnotationDimensions>();
expectedDimensions.set('foo', [
MockAnnotationLineProps.default({
specId: 'foo',
linePathPoints: {
x1: 0,
y1: 80,
x2: 100,
y2: 80,
},
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
]);
expectedDimensions.set('rect', [
{
details: undefined,
MockAnnotationRectProps.default({
rect: { x: 0, y: 50, width: 50, height: 20 },
panel: { top: 0, left: 0, width: 100, height: 100 },
},
datum: { coordinates: { x0: 'a', x1: 'b', y0: 3, y1: 5 } },
}),
]);

expect(dimensions).toEqual(expectedDimensions);
Expand Down Expand Up @@ -156,14 +157,15 @@ describe('Annotation utils', () => {

const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 0,
y1: 80,
x2: 10,
y2: 80,
},
panel,
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -199,14 +201,15 @@ describe('Annotation utils', () => {

const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 0,
y1: 80,
x2: 10,
y2: 80,
},
panel: { width: 10, height: 100, top: 0, left: 0 },
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -241,13 +244,14 @@ describe('Annotation utils', () => {

const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 0,
y1: 80,
x2: 100,
y2: 80,
},
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -313,13 +317,14 @@ describe('Annotation utils', () => {

const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 12.5,
y1: 0,
x2: 12.5,
y2: 100,
},
details: { detailsText: 'foo', headerText: 'a' },
datum: { dataValue: 'a', details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -354,13 +359,14 @@ describe('Annotation utils', () => {
const dimensions = computeAnnotationDimensionsSelector(store.getState());
const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 25,
y1: 0,
x2: 25,
y2: 100,
},
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -395,13 +401,14 @@ describe('Annotation utils', () => {
const dimensions = computeAnnotationDimensionsSelector(store.getState());
const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 25,
y1: 0,
x2: 25,
y2: 100,
},
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -436,13 +443,14 @@ describe('Annotation utils', () => {
const dimensions = computeAnnotationDimensionsSelector(store.getState());
const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 12.5,
y1: 0,
x2: 12.5,
y2: 100,
},
details: { detailsText: 'foo', headerText: 'a' },
datum: { dataValue: 'a', details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -478,14 +486,15 @@ describe('Annotation utils', () => {
const dimensions = computeAnnotationDimensionsSelector(store.getState());
const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 12.5,
y1: 0,
x2: 12.5,
y2: 100,
},
panel,
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -521,14 +530,15 @@ describe('Annotation utils', () => {
const dimensions = computeAnnotationDimensionsSelector(store.getState());
const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 12.5,
y1: 0,
x2: 12.5,
y2: 100,
},
panel,
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -563,13 +573,14 @@ describe('Annotation utils', () => {
const dimensions = computeAnnotationDimensionsSelector(store.getState());
const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 25,
y1: 0,
x2: 25,
y2: 100,
},
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down Expand Up @@ -605,14 +616,15 @@ describe('Annotation utils', () => {
const dimensions = computeAnnotationDimensionsSelector(store.getState());
const expectedDimensions: AnnotationLineProps[] = [
MockAnnotationLineProps.default({
specId: 'foo-line',
linePathPoints: {
x1: 25,
y1: 0,
x2: 25,
y2: 50,
},
panel,
details: { detailsText: 'foo', headerText: '2' },
datum: { dataValue: 2, details: 'foo' },
}),
];
expect(dimensions.get('foo-line')).toEqual(expectedDimensions);
Expand Down
Loading