mirror of
https://github.com/grafana/grafana.git
synced 2024-12-30 10:47:30 -06:00
Chore: Fixes PhantomJs by adding polyfills for fetch and AbortController (#21655)
* Chore: Fixes PhantomJs rendering * Docs: Updated docs * Update contribute/style-guides/e2e.md Co-Authored-By: Dominik Prokop <dominik.prokop@grafana.com> * Docs: Updates docs according to PR comments Co-authored-by: Dominik Prokop <dominik.prokop@grafana.com>
This commit is contained in:
parent
c228cde2b6
commit
5dddc91ba5
@ -150,6 +150,14 @@ describe('List test', () => {
|
||||
|
||||
## Debugging PhantomJS image rendering
|
||||
|
||||
### Common Error
|
||||
The most common error with PhantomJs image rendering is when a PR introduces an import that has functionality that's not supported by PhantomJs. To quickly identify which new import causes this you can use a tool like `es-check`.
|
||||
|
||||
1. Run > `npx es-check es5 './public/build/*.js'`
|
||||
2. Check the output for files that break es5 compatibility.
|
||||
3. Lazy load the failing imports if possible.
|
||||
|
||||
### Debugging
|
||||
There is no easy or comprehensive way to debug PhantomJS smoke test (image rendering) failures. However, PhantomJS exposes remote debugging interface which can give you a sense of what is going wrong in the smoke test. Before performing the steps described below make sure your local Grafana instance is running:
|
||||
|
||||
1. Go to `tools/phantomjs` directory
|
||||
|
@ -208,6 +208,7 @@
|
||||
"@types/md5": "^2.1.33",
|
||||
"@types/react-loadable": "5.5.2",
|
||||
"@types/react-virtualized-auto-sizer": "1.0.0",
|
||||
"abortcontroller-polyfill": "1.4.0",
|
||||
"angular": "1.6.9",
|
||||
"angular-bindonce": "0.3.1",
|
||||
"angular-native-dragdrop": "1.2.2",
|
||||
@ -267,6 +268,7 @@
|
||||
"tether-drop": "https://github.com/torkelo/drop/tarball/master",
|
||||
"tinycolor2": "1.4.1",
|
||||
"tti-polyfill": "0.2.2",
|
||||
"whatwg-fetch": "3.0.0",
|
||||
"xss": "1.0.3"
|
||||
},
|
||||
"resolutions": {
|
||||
|
@ -1,4 +1,6 @@
|
||||
import '@babel/polyfill';
|
||||
import 'whatwg-fetch'; // fetch polyfill needed for PhantomJs rendering
|
||||
import 'abortcontroller-polyfill/dist/polyfill-patch-fetch'; // fetch polyfill needed for PhantomJs rendering
|
||||
import 'file-saver';
|
||||
import 'lodash';
|
||||
import 'jquery';
|
||||
@ -20,11 +22,21 @@ import config from 'app/core/config';
|
||||
import ttiPolyfill from 'tti-polyfill';
|
||||
// @ts-ignore ignoring this for now, otherwise we would have to extend _ interface with move
|
||||
import _ from 'lodash';
|
||||
import { AppEvents, setMarkdownOptions, setLocale } from '@grafana/data';
|
||||
import { AppEvents, setLocale, setMarkdownOptions } from '@grafana/data';
|
||||
import appEvents from 'app/core/app_events';
|
||||
import { addClassIfNoOverlayScrollbar } from 'app/core/utils/scrollbar';
|
||||
import { checkBrowserCompatibility } from 'app/core/utils/browser';
|
||||
import { importPluginModule } from 'app/features/plugins/plugin_loader';
|
||||
import { angularModules, coreModule } from 'app/core/core_module';
|
||||
import { registerAngularDirectives } from 'app/core/core';
|
||||
import { setupAngularRoutes } from 'app/routes/routes';
|
||||
import { registerEchoBackend, setEchoSrv } from '@grafana/runtime';
|
||||
import { Echo } from './core/services/echo/Echo';
|
||||
import { reportPerformance } from './core/services/echo/EchoSrv';
|
||||
import { PerformanceBackend } from './core/services/echo/backends/PerformanceBackend';
|
||||
|
||||
import 'app/routes/GrafanaCtrl';
|
||||
import 'app/features/all';
|
||||
|
||||
// add move to lodash for backward compatabiltiy
|
||||
// @ts-ignore
|
||||
@ -33,17 +45,6 @@ _.move = (array: [], fromIndex: number, toIndex: number) => {
|
||||
return array;
|
||||
};
|
||||
|
||||
import { coreModule, angularModules } from 'app/core/core_module';
|
||||
import { registerAngularDirectives } from 'app/core/core';
|
||||
import { setupAngularRoutes } from 'app/routes/routes';
|
||||
import { setEchoSrv, registerEchoBackend } from '@grafana/runtime';
|
||||
import { Echo } from './core/services/echo/Echo';
|
||||
import { reportPerformance } from './core/services/echo/EchoSrv';
|
||||
import { PerformanceBackend } from './core/services/echo/backends/PerformanceBackend';
|
||||
|
||||
import 'app/routes/GrafanaCtrl';
|
||||
import 'app/features/all';
|
||||
|
||||
// import symlinked extensions
|
||||
const extensionsIndex = (require as any).context('.', true, /extensions\/index.ts/);
|
||||
extensionsIndex.keys().forEach((key: any) => {
|
||||
|
@ -4841,6 +4841,11 @@ abbrev@1, abbrev@~1.1.1:
|
||||
resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
|
||||
integrity sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==
|
||||
|
||||
abortcontroller-polyfill@1.4.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/abortcontroller-polyfill/-/abortcontroller-polyfill-1.4.0.tgz#0d5eb58e522a461774af8086414f68e1dda7a6c4"
|
||||
integrity sha512-3ZFfCRfDzx3GFjO6RAkYx81lPGpUS20ISxux9gLxuKnqafNcFQo59+IoZqpO2WvQlyc287B62HDnDdNYRmlvWA==
|
||||
|
||||
accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7:
|
||||
version "1.3.7"
|
||||
resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.7.tgz#531bc726517a3b2b41f850021c6cc15eaab507cd"
|
||||
@ -22227,7 +22232,7 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3:
|
||||
dependencies:
|
||||
iconv-lite "0.4.24"
|
||||
|
||||
whatwg-fetch@>=0.10.0:
|
||||
whatwg-fetch@3.0.0, whatwg-fetch@>=0.10.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb"
|
||||
integrity sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q==
|
||||
|
Loading…
Reference in New Issue
Block a user