not working in nativescript 7

[ray007]

On upgrading to nativescript 7 (and getting over many other problems), SVGImage does not seem to be compatible with the new version. Or maybe it's only the vue-js wrapper? Which I have registered with

Vue.registerElement('SVGImage', () => require('@jnorkus/nativescript-svg').SVGImage);

Exception output on startup:

JS: {NSVue (Vue: 2.6.12 | NSVue: 2.8.1)} -> CreateElement(svgimage)
JS: TypeError: Class constructor View cannot be invoked without 'new'
JS: [Vue warn]: Error in nextTick: "TypeError: Cannot read property '$scopedSlots' of undefined"
System.err: An uncaught Exception occurred on "main" thread.
System.err: Unable to start activity ComponentInfo{com.my.domain/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: Calling js method onCreate failed
System.err: TypeError: Cannot read property 'setAttribute' of undefined
System.err:
System.err: StackTrace:
System.err: java.lang.RuntimeException: Unable to start activity ComponentInfo{com.loytec.lweb804/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: Calling js method onCreate failed
System.err: TypeError: Cannot read property 'setAttribute' of undefined
System.err:     at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3114)
System.err:     at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3257)
System.err:     at android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:78)
System.err:     at android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:108)
System.err:     at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:68)
System.err:     at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1948)
System.err:     at android.os.Handler.dispatchMessage(Handler.java:106)
System.err:     at android.os.Looper.loop(Looper.java:214)
System.err:     at android.app.ActivityThread.main(ActivityThread.java:7050)
System.err:     at java.lang.reflect.Method.invoke(Native Method)
System.err:     at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:494)
System.err:     at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:965)
System.err: Caused by: com.tns.NativeScriptException: Calling js method onCreate failed
System.err: TypeError: Cannot read property 'setAttribute' of undefined
System.err:     at com.tns.Runtime.callJSMethodNative(Native Method)
System.err:     at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1302)
System.err:     at com.tns.Runtime.callJSMethodImpl(Runtime.java:1188)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1175)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1153)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:1149)
System.err:     at com.tns.NativeScriptActivity.onCreate(NativeScriptActivity.java:29)
System.err:     at android.app.Activity.performCreate(Activity.java:7327)
System.err:     at android.app.Activity.performCreate(Activity.java:7318)
System.err:     at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1271)
System.err:     at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3094)
System.err:     ... 11 more

Note: I'm using the plugin-version from @jnorkus, but looking at the repository tree, I suspect all will have the same problem.

[ray007]

Not sure if it's a typescript problem, or a problem of the existing js-file, but the exception happens in svg.common.js in the constructor:

var SVGImage = (function (_super) {
    __extends(SVGImage, _super);
    function SVGImage(options) {
        return _super.call(this) || this;
    }
...
}

And the call _super.call(this) is the one the browser is complaining about.

[ray007]

Update: this does seem to be a problem of typescript output.

But for nativescript 7, maybe setting the target to "es6" could fix the problem?

[SmailHammour]

@ray007 This fork works in NS7 https://github.com/SergeyMell/nativescript-plugins/tree/main/packages/nativescript-svg