Missing definition from union type when triggered from JSX tag name
See original GitHub issueBug Report
This is a sample code for have a clean issue.
import React from 'react';
class A {
Renderer = RendererA;
}
class B {
Renderer = RendererB;
}
const RendererA = () => {
return <div> A </div>;
};
const RendererB = () => {
return <div> B </div>;
};
const TestRendererTypes = () => {
const AB: A | B = null; // just for the demo, AB can be A or B !
AB.Renderer; //🟩 okey cool,ts find all refs !
const LostRef = <AB.Renderer />; //🟥 not cool ,ts seem remove refs !
return LostRef;
};
🙁 Actual behavior
Ts decode only one reference to a function jsx when using inside tag </>
It should show both Renderer ref here !
🙂 Expected behavior
We should get all refs like that’s . (working if use only a variable ref without a jsx tag <></>
)
The example is basic, but inside my project i losing all refs, and this is a issu if i need fast track where a rendering is pointing ! And also will give incorrect props Intelisence ! Example here is missing all my others plugins ! But if i add a direct ref like that’s , i can get all refs, but is polluting my code
It seem that’s TS have some difficulty to understand JSX !
Is there a hacky and (clean way) to fix this ? or tell me if you guys have temp solutions ?
I hope i exposed correctly my issue !
thanks @+
TSC: Version 4.2.3 Version : 1.55.0 (user setup) Commit : c185983a683d14c396952dd432459097bc7f757f Date : 2021-03-30T16:01:55.261Z Electron : 11.3.0 Chrome : 87.0.4280.141 Node.js : 12.18.3 V8 : 8.7.220.31-electron.0 OS : Windows_NT x64 10.0.19042
Issue Analytics
- State:
- Created 2 years ago
- Comments:7 (3 by maintainers)
Top GitHub Comments
Doesn’t repro for me. Can you share a project/repo?
ho yes, i’m sorry for the confusion, i’m not always comfortable with english terminology. thanks for the information !