if/SymphonyElectron
1
0
Fork 0
mirror of https://github.com/finos/SymphonyElectron.git synced 2024-11-22 08:57:00 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1146 from psjostrom/SDA-2751-BI-and-loggerfix-and-screensize-fix

Browse Source 
fix: SDA-2751 Fixed so BI can be sent from renderer process, etc
This commit is contained in:
psjostrom 2020-12-11 09:36:18 +01:00 committed by GitHub
commit 455efe350f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 59 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
spec/annotateArea.spec.tsx
View File

@ -2,7 +2,7 @@ import { mount } from 'enzyme';
import * as React from 'react';
import AnnotateArea from '../src/renderer/components/annotate-area';
import { Tool } from '../src/renderer/components/snipping-tool';
import * as analyticsHandler from './../src/app/analytics-handler';
import { ipcRenderer } from './__mocks__/electron';
const defaultProps = {
paths: [],
@ -127,7 +127,7 @@ describe('<AnnotateArea/>', () => {
});
it('should send annotate_erased if clicked on path with tool eraser', () => {
const spy = jest.spyOn(analyticsHandler.analytics, 'track');
const spy = jest.spyOn(ipcRenderer, 'send');
const pathProps = {
paths: [{
points: [{ x: 0, y: 0 }],
@ -146,19 +146,19 @@ describe('<AnnotateArea/>', () => {
};
const wrapper = mount(<AnnotateArea {...pathProps} />);
const path = wrapper.find('[data-testid="path0"]');
const expectedValue = { action_type: 'annotate_erased', element: 'screen_capture_annotate' };
const expectedValue = { type: 'annotate_erased', element: 'screen_capture_annotate' };
path.simulate('click');
expect(spy).toBeCalledWith(expectedValue);
expect(spy).toBeCalledWith('send-tracking-data-to-main', expectedValue);
});
it('should send annotate_added_pen event when drawn with pen', () => {
const spy = jest.spyOn(analyticsHandler.analytics, 'track');
const expectedValue = { action_type: 'annotate_added_pen', element: 'screen_capture_annotate' };
const spy = jest.spyOn(ipcRenderer, 'send');
const expectedValue = { type: 'annotate_added_pen', element: 'screen_capture_annotate' };
const wrapper = mount(<AnnotateArea {...defaultProps} />);
const area = wrapper.find('[data-testid="annotate-area"]');
area.simulate('mousedown', { pageX: 2, pageY: 49 });
area.simulate('mouseup');
expect(spy).toBeCalledWith(expectedValue);
expect(spy).toBeCalledWith('send-tracking-data-to-main', expectedValue);
});
it('should send annotate_added_highlight event when drawn with highlight', () => {
@ -172,12 +172,12 @@ describe('<AnnotateArea/>', () => {
chosenTool: Tool.highlight,
screenSnippetPath: 'very-nice-path',
};
const spy = jest.spyOn(analyticsHandler.analytics, 'track');
const expectedValue = { action_type: 'annotate_added_highlight', element: 'screen_capture_annotate' };
const spy = jest.spyOn(ipcRenderer, 'send');
const expectedValue = { type: 'annotate_added_highlight', element: 'screen_capture_annotate' };
const wrapper = mount(<AnnotateArea {...highlightProps} />);
const area = wrapper.find('[data-testid="annotate-area"]');
area.simulate('mousedown', { pageX: 2, pageY: 49 });
area.simulate('mouseup');
expect(spy).toBeCalledWith(expectedValue);
expect(spy).toBeCalledWith('send-tracking-data-to-main', expectedValue);
});
});

19
spec/snippingTool.spec.tsx
View File

@ -1,7 +1,6 @@
import { mount, shallow } from 'enzyme';
import * as React from 'react';
import SnippingTool from '../src/renderer/components/snipping-tool';
import * as analyticsHandler from './../src/app/analytics-handler';
import { ipcRenderer } from './__mocks__/electron';
const waitForPromisesToResolve = () => new Promise((resolve) => setTimeout(resolve));
@ -23,30 +22,30 @@ describe('Snipping Tool', () => {
});
it('should send screenshot_taken BI event on component mount', () => {
const spy = jest.spyOn(analyticsHandler.analytics, 'track');
const expectedValue = { action_type: 'screenshot_taken', element: 'screen_capture_annotate' };
const spy = jest.spyOn(ipcRenderer, 'send');
const expectedValue = { type: 'screenshot_taken', element: 'screen_capture_annotate' };
mount(React.createElement(SnippingTool));
expect(spy).toBeCalledWith(expectedValue);
expect(spy).toBeCalledWith('send-tracking-data-to-main', expectedValue);
});
it('should send capture_sent BI event when clicking done', async () => {
const spy = jest.spyOn(analyticsHandler.analytics, 'track');
const expectedValue = { action_type: 'annotate_done', element: 'screen_capture_annotate' };
const spy = jest.spyOn(ipcRenderer, 'send');
const expectedValue = { type: 'annotate_done', element: 'screen_capture_annotate' };
const wrapper = mount(React.createElement(SnippingTool));
wrapper.find('[data-testid="done-button"]').simulate('click');
wrapper.update();
await waitForPromisesToResolve();
expect(spy).toBeCalledWith(expectedValue);
expect(spy).toBeCalledWith('send-tracking-data-to-main', expectedValue);
});
it('should send annotate_cleared BI event when clicking clear', async () => {
const spy = jest.spyOn(analyticsHandler.analytics, 'track');
const expectedValue = { action_type: 'annotate_cleared', element: 'screen_capture_annotate' };
const spy = jest.spyOn(ipcRenderer, 'send');
const expectedValue = { type: 'annotate_cleared', element: 'screen_capture_annotate' };
const wrapper = mount(React.createElement(SnippingTool));
wrapper.find('[data-testid="clear-button"]').simulate('click');
wrapper.update();
await waitForPromisesToResolve();
expect(spy).toBeCalledWith(expectedValue);
expect(spy).toBeCalledWith('send-tracking-data-to-main', expectedValue);
});
it('should render pen color picker when clicked on pen', () => {

12
src/app/screen-snippet-handler.ts
View File

@ -16,6 +16,7 @@ import {
} from '../common/env';
import { i18n } from '../common/i18n';
import { logger } from '../common/logger';
import { analytics, AnalyticsElements, ScreenSnippetActionTypes } from './analytics-handler';
import { updateAlwaysOnTop } from './window-actions';
import { windowHandler } from './window-handler';
import { windowExists } from './window-utils';
@ -115,6 +116,7 @@ class ScreenSnippet {
windowHandler.closeSnippingToolWindow();
windowHandler.createSnippingToolWindow(this.outputFileName, imageSize);
this.uploadSnippet(webContents);
this.sendAnalytics();
return;
}
const {
@ -316,6 +318,16 @@ class ScreenSnippet {
}
});
}
/**
* Send analytics data to analytics module
*/
private sendAnalytics() {
ipcMain.on('send-tracking-data-to-main', async (_event, eventData: { element: AnalyticsElements, type: ScreenSnippetActionTypes }) => {
analytics.track({element: eventData.element, action_type: eventData.type});
});
}
}
const screenSnippet = new ScreenSnippet();

22
src/app/window-handler.ts
View File

@ -986,13 +986,20 @@ export class WindowHandler {
width: number;
},
): void {
const parentWindow = BrowserWindow.getFocusedWindow();
// Prevents creating multiple instances
if (didVerifyAndRestoreWindow(this.snippingToolWindow) || !parentWindow) {
if (didVerifyAndRestoreWindow(this.snippingToolWindow)) {
logger.error('window-handler: Could not open snipping tool window');
return;
}
const electronWindows = BrowserWindow.getAllWindows();
const mainWindow = electronWindows[0];
if (!mainWindow) {
logger.error('window-handler: Could not get main window');
return;
}
const OS_PADDING = 25;
const MIN_TOOL_HEIGHT = 312;
const MIN_TOOL_WIDTH = 320;
@ -1000,7 +1007,7 @@ export class WindowHandler {
const BUTTON_BAR_BOTTOM_HEIGHT = 72;
const BUTTON_BARS_HEIGHT = BUTTON_BAR_TOP_HEIGHT + BUTTON_BAR_BOTTOM_HEIGHT;
const display = electron.screen.getDisplayMatching(parentWindow.getBounds());
const display = electron.screen.getDisplayMatching(mainWindow.getBounds());
const workAreaSize = display.workAreaSize;
const maxToolHeight = Math.floor(calculatePercentage(workAreaSize.height, 90));
const maxToolWidth = Math.floor(calculatePercentage(workAreaSize.width, 90));
@ -1055,8 +1062,8 @@ export class WindowHandler {
opts.alwaysOnTop = true;
}
if (isWindowsOS && parentWindow) {
opts.parent = parentWindow;
if (isWindowsOS && mainWindow) {
opts.parent = mainWindow;
}
this.snippingToolWindow = createComponentWindow('snipping-tool', opts);
@ -1072,8 +1079,9 @@ export class WindowHandler {
snippetImageWidth: snipDimensions.width,
};
if (this.snippingToolWindow && windowExists(this.snippingToolWindow)) {
logger.info('window-handler: Opening snipping tool window with size: ', { toolHeight, toolWidth });
logger.info('window-handler: Opening snipping tool content with metadata: ', snippingToolInfo);
logger.info('window-handler: Opening snipping tool window on display: ' + JSON.stringify(display));
logger.info('window-handler: Opening snipping tool window with size: ' + JSON.stringify({ toolHeight, toolWidth }));
logger.info('window-handler: Opening snipping tool content with metadata: ' + JSON.stringify(snippingToolInfo));
this.snippingToolWindow.webContents.send(
'snipping-tool-data',
snippingToolInfo,

19
src/renderer/components/annotate-area.tsx
View File

@ -1,7 +1,7 @@
import { LazyBrush } from 'lazy-brush';
import * as React from 'react';
import { analytics, AnalyticsElements, ScreenSnippetActionTypes } from './../../app/analytics-handler';
import { IDimensions, IPath, IPoint, Tool } from './snipping-tool';
import { AnalyticsElements, ScreenSnippetActionTypes } from './../../app/analytics-handler';
import { IDimensions, IPath, IPoint, sendAnalyticsToMain, Tool } from './snipping-tool';
const { useState } = React;
@ -50,10 +50,7 @@ const AnnotateArea: React.FunctionComponent<IAnnotateAreaProps> = ({
updPaths.map((p) => {
if (p && p.key === key) {
p.shouldShow = false;
analytics.track({
element: AnalyticsElements.SCREEN_CAPTURE_ANNOTATE,
action_type: ScreenSnippetActionTypes.ANNOTATE_ERASED,
});
sendAnalyticsToMain(AnalyticsElements.SCREEN_CAPTURE_ANNOTATE, ScreenSnippetActionTypes.ANNOTATE_ERASED);
}
return p;
});
@ -232,16 +229,10 @@ const AnnotateArea: React.FunctionComponent<IAnnotateAreaProps> = ({
const handleMouseUp = () => {
stopDrawing();
if (chosenTool === Tool.pen) {
analytics.track({
element: AnalyticsElements.SCREEN_CAPTURE_ANNOTATE,
action_type: ScreenSnippetActionTypes.ANNOTATE_ADDED_PEN,
});
sendAnalyticsToMain(AnalyticsElements.SCREEN_CAPTURE_ANNOTATE, ScreenSnippetActionTypes.ANNOTATE_ADDED_PEN);
}
if (chosenTool === Tool.highlight) {
analytics.track({
element: AnalyticsElements.SCREEN_CAPTURE_ANNOTATE,
action_type: ScreenSnippetActionTypes.ANNOTATE_ADDED_HIGHLIGHT,
});
sendAnalyticsToMain(AnalyticsElements.SCREEN_CAPTURE_ANNOTATE, ScreenSnippetActionTypes.ANNOTATE_ADDED_HIGHLIGHT);
}
};

21
src/renderer/components/snipping-tool.tsx
View File

@ -2,7 +2,7 @@ import { ipcRenderer } from 'electron';
import * as React from 'react';
import { svgAsPngUri } from 'save-svg-as-png';
import { i18n } from '../../common/i18n-preload';
import { analytics, AnalyticsElements, ScreenSnippetActionTypes } from './../../app/analytics-handler';
import { AnalyticsElements, ScreenSnippetActionTypes } from './../../app/analytics-handler';
import AnnotateArea from './annotate-area';
import ColorPickerPill, { IColor } from './color-picker-pill';
@ -51,6 +51,10 @@ const availableHighlightColors: IColor[] = [
];
const SNIPPING_TOOL_NAMESPACE = 'ScreenSnippet';
export const sendAnalyticsToMain = (element: AnalyticsElements, type: ScreenSnippetActionTypes): void => {
ipcRenderer.send('send-tracking-data-to-main', { element, type });
};
const SnippingTool: React.FunctionComponent<ISnippingToolProps> = ({ existingPaths }) => {
// State preparation functions
@ -91,10 +95,7 @@ const SnippingTool: React.FunctionComponent<ISnippingToolProps> = ({ existingPat
useLayoutEffect(() => {
ipcRenderer.once('snipping-tool-data', getSnipImageData);
analytics.track({
element: AnalyticsElements.SCREEN_CAPTURE_ANNOTATE,
action_type: ScreenSnippetActionTypes.SCREENSHOT_TAKEN,
});
sendAnalyticsToMain(AnalyticsElements.SCREEN_CAPTURE_ANNOTATE, ScreenSnippetActionTypes.SCREENSHOT_TAKEN);
return () => {
ipcRenderer.removeListener('snipping-tool-data', getSnipImageData);
};
@ -165,10 +166,7 @@ const SnippingTool: React.FunctionComponent<ISnippingToolProps> = ({ existingPat
return p;
});
setPaths(updPaths);
analytics.track({
element: AnalyticsElements.SCREEN_CAPTURE_ANNOTATE,
action_type: ScreenSnippetActionTypes.ANNOTATE_CLEARED,
});
sendAnalyticsToMain(AnalyticsElements.SCREEN_CAPTURE_ANNOTATE, ScreenSnippetActionTypes.ANNOTATE_CLEARED);
};
// Utility functions
@ -202,10 +200,7 @@ const SnippingTool: React.FunctionComponent<ISnippingToolProps> = ({ existingPat
const done = async () => {
const svg = document.getElementById('annotate-area');
const mergedImageData = svg ? await svgAsPngUri(document.getElementById('annotate-area'), {}) : 'MERGE_FAIL';
analytics.track({
element: AnalyticsElements.SCREEN_CAPTURE_ANNOTATE,
action_type: ScreenSnippetActionTypes.ANNOTATE_DONE,
});
sendAnalyticsToMain(AnalyticsElements.SCREEN_CAPTURE_ANNOTATE, ScreenSnippetActionTypes.ANNOTATE_DONE );
ipcRenderer.send('upload-snippet', { screenSnippetPath, mergedImageData });
};