diff options
| author | Jeremy Rifkin <51220084+jeremy-rifkin@users.noreply.github.com> | 2022-12-12 17:59:19 -0500 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-12-12 17:59:19 -0500 |
| commit | abb943bdf03a9fb5ec33327abe008413cec83d42 (patch) | |
| tree | 60e79d77076d87c43858df117b4454833d5c9001 | |
| parent | e2acc233ff0b9d83067939d27df6dfd74d5a956a (diff) | |
| download | compiler-explorer-gh-5313.tar.gz compiler-explorer-gh-5313.zip | |
Fix cfg chrome render bug (#4423)gh-5313
| -rw-r--r-- | static/panes/cfg-view.ts | 6 |
1 files changed, 5 insertions, 1 deletions
diff --git a/static/panes/cfg-view.ts b/static/panes/cfg-view.ts index 86c016ee9..2515f8b2f 100644 --- a/static/panes/cfg-view.ts +++ b/static/panes/cfg-view.ts @@ -76,6 +76,7 @@ export class Cfg extends Pane<CfgState> { state: CfgState & PaneState; layout: GraphLayoutCore; bbMap: Record<string, HTMLDivElement> = {}; + readonly extraTransforms: string; constructor(hub: Hub, container: Container, state: CfgState & PaneState) { if ((state as any).selectedFn) { @@ -109,6 +110,9 @@ export class Cfg extends Pane<CfgState> { }, }); this.state = state; + // This is a workaround for a chrome render bug that's existed since at least 2013 + // https://github.com/compiler-explorer/compiler-explorer/issues/4421 + this.extraTransforms = navigator.userAgent.indexOf('AppleWebKit') === -1 ? '' : ' translateZ(0)'; } override getInitialHTML() { @@ -165,7 +169,7 @@ export class Cfg extends Pane<CfgState> { const prevZoom = this.state.zoom; this.state.zoom += delta; if (this.state.zoom >= MINZOOM) { - this.graphElement.style.transform = `scale(${this.state.zoom})`; + this.graphElement.style.transform = `scale(${this.state.zoom})${this.extraTransforms}`; const mouseX = e.clientX - this.graphElement.getBoundingClientRect().x; const mouseY = e.clientY - this.graphElement.getBoundingClientRect().y; // Amount that the zoom will offset is mouseX / width before zoom * delta * unzoomed width |