Utils: Global debugger utils (#32951)

* Global debugger utils

* Update packages/grafana-ui/src/utils/debug.ts

Co-authored-by: Hugo Häggmark <hugo.haggmark@grafana.com>

* Update packages/grafana-ui/src/utils/debug.ts

Co-authored-by: Hugo Häggmark <hugo.haggmark@grafana.com>

* Update packages/grafana-ui/src/components/uPlot/utils.ts

Co-authored-by: Torkel Ödegaard <torkel@grafana.org>

* Update packages/grafana-ui/src/utils/debug.ts

Co-authored-by: Torkel Ödegaard <torkel@grafana.org>

* fix merge suggestion

* Typos

Co-authored-by: Hugo Häggmark <hugo.haggmark@grafana.com>
Co-authored-by: Torkel Ödegaard <torkel@grafana.org>
This commit is contained in:
Dominik Prokop 2021-04-14 12:58:56 +02:00 committed by GitHub
parent 52243d859b
commit 024b6b5779
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 60 additions and 29 deletions

View File

@ -1,7 +1,7 @@
import { deprecationWarning, UrlQueryMap, urlUtil } from '@grafana/data';
import * as H from 'history';
import { LocationUpdate } from './LocationSrv';
import { createLogger } from '@grafana/ui';
import { attachDebugger, createLogger } from '@grafana/ui';
import { config } from '../config';
/**
@ -35,24 +35,6 @@ export class HistoryWrapper implements LocationService {
? H.createMemoryHistory({ initialEntries: ['/'] })
: H.createBrowserHistory({ basename: config.appSubUrl ?? '/' });
// For debugging purposes the location service is attached to global _debug variable
if (process.env.NODE_ENV !== 'production') {
// @ts-ignore
let debugGlobal = window['_debug'];
if (debugGlobal) {
debugGlobal = {
...debugGlobal,
location: this,
};
} else {
debugGlobal = {
location: this,
};
}
// @ts-ignore
window['_debug'] = debugGlobal;
}
this.partial = this.partial.bind(this);
this.push = this.push.bind(this);
this.replace = this.replace.bind(this);
@ -168,5 +150,10 @@ export const setLocationService = (location: LocationService) => {
locationService = location;
};
const navigationLog = createLogger('Router');
/** @internal */
export const navigationLogger = createLogger('Router');
export const navigationLogger = navigationLog.logger;
// For debugging purposes the location service is attached to global _debug variable
attachDebugger('location', locationService, navigationLog);

View File

@ -2,8 +2,8 @@ import { DataFrame, dateTime, FieldType } from '@grafana/data';
import { AlignedData, Options } from 'uplot';
import { PlotPlugin, PlotProps } from './types';
import { createLogger } from '../../utils/logger';
import { attachDebugger } from '../../utils';
const LOGGING_ENABLED = false;
const ALLOWED_FORMAT_STRINGS_REGEX = /\b(YYYY|YY|MMMM|MMM|MM|M|DD|D|WWWW|WWW|HH|H|h|AA|aa|a|mm|m|ss|s|fff)\b/g;
export function timeFormatToTemplate(f: string) {
@ -63,4 +63,7 @@ export function preparePlotData(frame: DataFrame, ignoreFieldTypes?: FieldType[]
// Dev helpers
/** @internal */
export const pluginLog = createLogger('uPlot Plugin', LOGGING_ENABLED);
export const pluginLogger = createLogger('uPlot Plugin');
export const pluginLog = pluginLogger.logger;
attachDebugger('graphng', undefined, pluginLogger);

View File

@ -0,0 +1,22 @@
import { Logger } from './logger';
/**
* Allows debug helpers attachement to the window object
* @internal
*/
export function attachDebugger(key: string, thebugger?: any, logger?: Logger) {
if (process.env.NODE_ENV === 'production') {
return;
}
let completeDebugger = thebugger || {};
if (logger !== undefined) {
completeDebugger = { ...completeDebugger, enable: () => logger.enable(), disable: () => logger.disable() };
}
// @ts-ignore
let debugGlobal = window['_debug'] ?? {};
debugGlobal[key] = completeDebugger;
// @ts-ignore
window['_debug'] = debugGlobal;
}

View File

@ -12,3 +12,4 @@ import * as DOMUtil from './dom'; // includes Element.closest polyfill
export { DOMUtil };
export { renderOrCallToRender } from './renderOrCallToRender';
export { createLogger } from './logger';
export { attachDebugger } from './debug';

View File

@ -1,15 +1,33 @@
import throttle from 'lodash/throttle';
/** @internal */
/**
* @internal
* */
const throttledLog = throttle((...t: any[]) => {
console.log(...t);
}, 500);
/**
* @internal
*/
export interface Logger {
logger: (...t: any[]) => void;
enable: () => void;
disable: () => void;
}
/** @internal */
export const createLogger = (name: string, enable = true) => (id: string, throttle = false, ...t: any[]) => {
if (process.env.NODE_ENV === 'production' || process.env.NODE_ENV === 'test' || !enable) {
return;
}
const fn = throttle ? throttledLog : console.log;
fn(`[${name}: ${id}]: `, ...t);
export const createLogger = (name: string): Logger => {
let LOGGIN_ENABLED = false;
return {
logger: (id: string, throttle = false, ...t: any[]) => {
if (process.env.NODE_ENV === 'production' || process.env.NODE_ENV === 'test' || !LOGGIN_ENABLED) {
return;
}
const fn = throttle ? throttledLog : console.log;
fn(`[${name}: ${id}]: `, ...t);
},
enable: () => (LOGGIN_ENABLED = true),
disable: () => (LOGGIN_ENABLED = false),
};
};