airbnb/react-sketchapp

SVG rendering broken in Sketch 85.1

macintoshhelper opened this issue · 2 comments

I am...

| -------------------------------------------------------------------------------------------------

Reporting a bug or issue

Expected behavior:

Should render an SVG

Observed behavior:

TypeError: svgImporter.graph().width is not a function. (In 'svgImporter.graph().width()', 'svgImporter.graph().width' is undefined)

image

How to reproduce:

curl https://codeload.github.com/airbnb/react-sketchapp/tar.gz/master | tar -xz --strip=2 react-sketchapp-master/examples/basic-svg
cd basic-svg

Sketch version:

85.1

Please attach screenshots, a zip file of your project, and/or a link to your github project

https://github.com/airbnb/react-sketchapp/tree/master/examples/basic-svg

As a temporary fix (to unblock development), hardcoding the Node.js based SVG renderer for Sketch rendering works. The issue seems to be because of a Sketch private API change (graph property seems to be null).

Sketch SVG rendering seems to be fixed with my fork:

https://github.com/elemental-zcash/react-sketchapp/blob/85c5d3f5b2eade0df8d4d5f13e93a318747daf1e/src/jsonUtils/makeSvgLayer/index.sketch.ts#L13-L16

  const svgNativeLayer = svgImporter.importAsLayer();
  const svgLayer = DOM.Group.fromNative(svgNativeLayer).layers[0];


  const frame = NSMakeRect(0, 0, svgLayer.frame.width, svgLayer.frame.height);

I’ve published an experimental forked package to unblock this issue.

npm i react-sketchapp@npm:@elemental-zcash/react-sketchapp

Also, not sure if worth opening a new issue, but <Def> support seems to be broken with the SVG Node.js renderer, hence why I fixed the Sketch API renderer rather than using the Node.js one inside the Sketch environment.