[ios]ImageSVG with text will encountered a EXC_BAD_ACCESS crash

Description

Incident Identifier: 71EA35E5-F5BE-49A0-85CE-B7F5D7ACF29E
Hardware Model:      iPhone15,3
Process:             taroDemo [54389]
Path:                /private/var/containers/Bundle/Application/7B937636-43AC-4040-8E53-71735C7A73D7/taroDemo.app/taroDemo
Identifier:          com.playground.taro
Version:             1.11.0 (1.11.0.2312251806)
AppStoreTools:       15C5065a
AppVariant:          1:iPhone15,3:17
Beta:                YES
Code Type:           ARM-64 (Native)
Role:                Foreground
Parent Process:      launchd [1]
Coalition:           com.playground.taro [1918]

Date/Time:           2023-12-25 19:03:10.8964 +0800
Launch Time:         2023-12-25 19:02:31.7820 +0800
OS Version:          iPhone OS 17.3 (21D5026f)
Release Type:        Beta
Baseband Version:    2.20.05
Report Version:      104

Exception Type:  EXC_BAD_ACCESS (SIGSEGV)
Exception Subtype: KERN_INVALID_ADDRESS at 0xfffffffca9e13160
Exception Codes: 0x0000000000000001, 0xfffffffca9e13160
VM Region Info: 0xfffffffca9e13160 is not in any region.  Bytes after previous region: 18446743578343453025  
      REGION TYPE                 START - END      [ VSIZE] PRT/MAX SHRMOD  REGION DETAIL
      commpage (reserved)     1000000000-7000000000 [384.0G] ---/--- SM=NUL  ...(unallocated)
--->  
      UNUSED SPACE AT END
Termination Reason: SIGNAL 11 Segmentation fault: 11
Terminating Process: exc handler [54389]

Triggered by Thread:  0


Thread 0 name:
Thread 0 Crashed:
0   taroDemo                      	0x00000001017fc1e8 (anonymous namespace)::ShaperDrivenWrapper::wrap(char const*, unsigned long, SkShaper::BiDiRunIterator const&, SkShaper::LanguageRunIterator const&, SkShaper::ScriptRunIterator const&, SkShaper::Fo... + 2544
1   taroDemo                      	0x00000001017fb7cc (anonymous namespace)::ShaperHarfBuzz::shape(char const*, unsigned long, SkShaper::FontRunIterator&, SkShaper::BiDiRunIterator&, SkShaper::ScriptRunIterator&, SkShaper::LanguageRunIterator&, SkShap... + 208
2   taroDemo                      	0x00000001017fb6f0 (anonymous namespace)::ShaperHarfBuzz::shape(char const*, unsigned long, SkShaper::FontRunIterator&, SkShaper::BiDiRunIterator&, SkShaper::ScriptRunIterator&, SkShaper::LanguageRunIterator&, float,... + 32
3   taroDemo                      	0x00000001017fb65c (anonymous namespace)::ShaperHarfBuzz::shape(char const*, unsigned long, SkFont const&, bool, float, SkShaper::RunHandler*) const + 356
4   taroDemo                      	0x00000001018bc8d8 SkSVGTextContext::shapeFragment(SkString const&, SkSVGRenderContext const&, SkSVGXmlSpace) + 1588
5   taroDemo                      	0x00000001018bd568 SkSVGTextContainer::onShapeText(SkSVGRenderContext const&, SkSVGTextContext*, SkSVGXmlSpace) const + 372
6   taroDemo                      	0x00000001018bd978 SkSVGText::onRender(SkSVGRenderContext const&) const + 96
7   taroDemo                      	0x00000001018b3f84 SkSVGNode::render(SkSVGRenderContext const&) const + 76
8   taroDemo                      	0x00000001018a7e28 SkSVGContainer::onRender(SkSVGRenderContext const&) const + 56
9   taroDemo                      	0x00000001018b3f84 SkSVGNode::render(SkSVGRenderContext const&) const + 76
10  taroDemo                      	0x00000001018a7e28 SkSVGContainer::onRender(SkSVGRenderContext const&) const + 56
11  taroDemo                      	0x00000001018b3f84 SkSVGNode::render(SkSVGRenderContext const&) const + 76
12  taroDemo                      	0x00000001018a8b10 SkSVGDOM::render(SkCanvas*) const + 232
13  taroDemo                      	0x0000000101357874 RNSkia::JsiImageSvgNode::draw(RNSkia::DrawingContext*) + 508 (JsiImageSvgNode.h:39)
14  taroDemo                      	0x000000010132e4c0 RNSkia::JsiDomDrawingNode::renderNode(RNSkia::DrawingContext*) + 180 (JsiDomDrawingNode.h:0)
15  taroDemo                      	0x0000000101350800 RNSkia::JsiDomRenderNode::render(RNSkia::DrawingContext*) + 1328 (JsiDomRenderNode.h:108)
16  taroDemo                      	0x0000000101350268 RNSkia::JsiGroupNode::renderNode(RNSkia::DrawingContext*) + 116 (JsiGroupNode.h:19)
17  taroDemo                      	0x0000000101350800 RNSkia::JsiDomRenderNode::render(RNSkia::DrawingContext*) + 1328 (JsiDomRenderNode.h:108)
18  taroDemo                      	0x00000001012c3dec RNSkia::RNSkDomRenderer::renderCanvas(SkCanvas*, float, float) + 380 (RNSkDomView.cpp:109)
19  taroDemo                      	0x000000010137e7d8 std::__1::__function::__value_func<void (SkCanvas*)>::operator()[abi:v15006](SkCanvas*&&) const + 24 (function.h:512)
20  taroDemo                      	0x000000010137e7d8 std::__1::function<void (SkCanvas*)>::operator()(SkCanvas*) const + 24 (function.h:1197)
21  taroDemo                      	0x000000010137e7d8 RNSkMetalCanvasProvider::renderToCanvas(std::__1::function<void (SkCanvas*)> const&) + 344 (RNSkMetalCanvasProvider.mm:89)
22  taroDemo                      	0x00000001012c4034 RNSkia::RNSkDomRenderer::renderImmediate(std::__1::shared_ptr<RNSkia::RNSkCanvasProvider>) + 168 (RNSkDomView.cpp:58)
23  taroDemo                      	0x000000010138c900 RNSkia::RNSkView::renderImmediate() + 72 (RNSkView.h:236)
24  taroDemo                      	0x000000010138c85c -[SkiaUIView drawRect:] + 56 (SkiaUIView.mm:134)
25  UIKitCore                     	0x00000001b2ae053c -[UIView(CALayerDelegate) drawLayer:inContext:] + 508 (UIView.m:19745)
26  QuartzCore                    	0x00000001b1dce018 CABackingStoreUpdate_ + 252 (CABackingStore.cpp:1313)
27  QuartzCore                    	0x00000001b1dcdf10 invocation function for block in CA::Layer::display_() + 64 (CALayer.mm:10211)
28  QuartzCore                    	0x00000001b1dcd3c8 -[CALayer _display] + 1636 (CALayer.mm:10264)
29  QuartzCore                    	0x00000001b1dcc6e0 CA::Layer::layout_and_display_if_needed(CA::Transaction*) + 412 (CALayer.mm:2599)
30  QuartzCore                    	0x00000001b1dd2ac0 CA::Context::commit_transaction(CA::Transaction*, double, double*) + 464 (CAContextInternal.mm:2792)
31  QuartzCore                    	0x00000001b1dcbde0 CA::Transaction::commit() + 648 (CATransactionInternal.mm:432)
32  QuartzCore                    	0x00000001b1dcba88 CA::Transaction::flush_as_runloop_observer(bool) + 88 (CATransactionInternal.mm:942)
33  UIKitCore                     	0x00000001b2a301ac _UIApplicationFlushCATransaction + 52 (UIApplication.m:3153)
34  UIKitCore                     	0x00000001b2a2fcc4 _UIUpdateSequenceRun + 84 (_UIUpdateSequence.mm:119)
35  UIKitCore                     	0x00000001b2a2f3b4 schedulerStepScheduledMainSection + 144 (_UIUpdateScheduler.m:1037)
36  UIKitCore                     	0x00000001b2a2f470 runloopSourceCallback + 92 (_UIUpdateScheduler.m:1186)
37  CoreFoundation                	0x00000001b078911c __CFRUNLOOP_IS_CALLING_OUT_TO_A_SOURCE0_PERFORM_FUNCTION__ + 28 (CFRunLoop.c:1957)
38  CoreFoundation                	0x00000001b0788398 __CFRunLoopDoSource0 + 176 (CFRunLoop.c:2001)
39  CoreFoundation                	0x00000001b0786b4c __CFRunLoopDoSources0 + 244 (CFRunLoop.c:2038)
40  CoreFoundation                	0x00000001b0785888 __CFRunLoopRun + 828 (CFRunLoop.c:2955)
41  CoreFoundation                	0x00000001b0785468 CFRunLoopRunSpecific + 608 (CFRunLoop.c:3420)
42  GraphicsServices              	0x00000001f462e4f8 GSEventRunModal + 164 (GSEvent.c:2196)
43  UIKitCore                     	0x00000001b2bb2004 -[UIApplication _run] + 888 (UIApplication.m:3685)
44  UIKitCore                     	0x00000001b2bb1640 UIApplicationMain + 340 (UIApplication.m:5270)
45  taroDemo                      	0x0000000100d3cc98 main + 80 (main.m:8)
46  dyld                          	0x00000001d3deadcc start + 2240 (dyldMain.cpp:1269)

Version

0.1.223

Steps to reproduce

note: I am using react native 0.73.1. Versions 0.1.223 and above cause crashes. downgrading to 0.1.222 doesn't cause crashes.

import React from "react";
import { Canvas, ImageSVG, Skia } from "@shopify/react-native-skia";
 
const svg = Skia.SVG.MakeFromString(
  `<svg viewBox='0 0 290 500' xmlns='http://www.w3.org/2000/svg'>
    <circle cx='31' cy='325' r='120px' fill='#c02aaa'/>
    <text x="20" y="35">My</text>
  </svg>`
)!;
 
export const SVG = () => {
  return (
    <Canvas style={{ flex: 1 }}>
      <ImageSVG
        svg={svg}
        x={0}
        y={0}
        width={290}
        height={500}
      />
    </Canvas>
  );
};

Snack, code example, screenshot, or link to a repository

0.1.223+(ios) has this issue

@zhiqingchen thank you for reporting this. We confirm that libgrapheme (introduced in 0.1.223) seem to interfere negatively with the SVG module, we are looking into it as we are experiencing other integration issues with libgrapheme.

@zhiqingchen we think we may have found the issue we might be able to provide a fix for it soon.

Nice work. Glad to hear it.

Is any progress on this issue? Becase I see this problem still in version 0.1.241. Or can I use a version below 0.1.223 to circumvent this problem? @wcandillon

And a black background apeears on Android.

We do plan to make progress on this issue, in the meantime, you need to make sure that your svg doesn't have elements inside. And also the screenshot you posted seems unrelated to this bug report.

We finally have a fix for it, we will ship it asap :)