Skip to content

Commit

Permalink
fix(dia.LinkView): fix missing arrowheads in Safari (#2677)
Browse files Browse the repository at this point in the history
  • Loading branch information
kumilingus authored May 31, 2024
1 parent d985a7e commit 66442ad
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 1 deletion.
20 changes: 19 additions & 1 deletion packages/joint-core/src/dia/LinkView.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { addClassNamePrefix, merge, assign, isObject, isFunction, clone, isPerce
import { Point, Line, Path, normalizeAngle, Rect, Polyline } from '../g/index.mjs';
import * as routers from '../routers/index.mjs';
import * as connectors from '../connectors/index.mjs';

import { env } from '../env/index.mjs';

const Flags = {
TOOLS: CellView.Flags.TOOLS,
Expand Down Expand Up @@ -99,6 +99,11 @@ export const LinkView = CellView.extend({
this.updateHighlighters(true);
this.updateTools(opt);
flags = this.removeFlag(flags, [Flags.RENDER, Flags.UPDATE, Flags.LABELS, Flags.TOOLS, Flags.CONNECTOR]);

if (env.test('isSafari')) {
this.__fixSafariBug268376();
}

return flags;
}

Expand Down Expand Up @@ -151,6 +156,19 @@ export const LinkView = CellView.extend({
return flags;
},

__fixSafariBug268376: function() {
// Safari has a bug where any change after the first render is not reflected in the DOM.
// https://bugs.webkit.org/show_bug.cgi?id=268376
const { el } = this;
const childNodes = Array.from(el.childNodes);
const fragment = document.createDocumentFragment();
for (let i = 0, n = childNodes.length; i < n; i++) {
el.removeChild(childNodes[i]);
fragment.appendChild(childNodes[i]);
}
el.appendChild(fragment);
},

requestConnectionUpdate: function(opt) {
this.requestUpdate(this.getFlag(Flags.UPDATE), opt);
},
Expand Down
5 changes: 5 additions & 0 deletions packages/joint-core/src/env/index.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,11 @@ export const env = {
svgforeignobject: function() {
return !!document.createElementNS &&
/SVGForeignObject/.test(({}).toString.call(document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject')));
},

// works for iOS browsers too
isSafari: function() {
return /Safari/.test(navigator.userAgent) && /Apple Computer/.test(navigator.vendor);
}
},

Expand Down

0 comments on commit 66442ad

Please sign in to comment.