RFC Typings: Ractive.find() return type does not support SVGElements

seijikun commented 3 years ago

Description:

The find() method of a Ractive instance allows to find child DOM elements, rendered as part of the instance. At the moment, the return type of this method is HTMLElement. But as far as I understand it, Ractive should also allow svg here.

SVG elements in TypeScript do not inherit HTMLElement and can thus not be casted to SVGElement directly. But there seems to be a bridge type: HTMLOrSVGElement.

Thus I suggest changing the return-type of the find() method to that.

Am I misusing something here? Is there maybe a special find() for svg elements I am missing, or are they not meant to be used with this function at all?

Versions affected:

2.0.0-build-7

Current workaround

let svgEl = ((this.find('svg') as HTMLOrSVGElement) as SVGSVGElement);

marcalexiei commented 3 years ago

I have change value of find/findAll constraint to Element. So now you can do:

const svgs = myComponent.findAll<SVGElement>('svg');
const svgPath = myComponent.find<SVGPathElement>('svg path');

Note that this fix will be included in the last edge (1.4.0-build-*) build when the PR is merged. I suggest you to use that version. Ractive 2.x doesn't include new features so you should have no problem downgrading.

marcalexiei commented 3 years ago

Change is now available on ractive@1.4.0-build-55

seijikun commented 3 years ago

Just upgraded, works like a charm. Thank you very much!

ractivejs / ractive