renderTarget not getting rendered on server in SSR
See original GitHub issueHello,
I’m using TetherComponent in an SSR environment and I noticed, when I turned JS off to see my server rendered page, that the renderTarget
prop and the items its taking are not rendered on the server. Is there a reason for this? I looked at the source and can’t seem to figure out why it wouldn’t be, but maybe I’m missing something. Here is my code, in case it helps, but I imagine that you’d be able to duplicate this without my code since there isn’t anything special about it (plus my code is obviously tailored to the project, but maybe you can spot something in it that I’m missing):
<TetherComponent
key={tetherKey}
className={tetherClasses}
attachment="top left"
targetAttachment="bottom left"
constraints={[
{
to: 'window',
pin: true
}
]}
renderTarget={ref => {
return (
<span ref={ref}>
<TextInput
ref={node => { this._textInput = node; }}
name={name}
disabled={disabled}
defaultValue={selectedDate}
onFocus={this._onInputFocus}
icon={(useIcon)
? <Icon name="calendar" />
: null
}
iconPosition="right"
autoFocus={autoFocus}
focus={focus}
placeholder={placeholder}
readOnly
/>
</span>
);
}}
renderElement={ref => {
return showCalendar && (
<DatePickerCalendar
ref={ref}
className={calendarClassName}
onChange={this._onDateChange}
selectedDate={this.state.selectedDate}
disablePast={disablePast}
disableBefore={disableBefore}
disableAfter={disableAfter}
overrideInitialMonthWithSelected={overrideInitialMonthWithSelected}
/>
);
}}
/>
This all works fine in the browser, by the way, and there is nothing special about TextInput, its just a wrapper for input
to add some additional styling for our core UI components look and feel.
Issue Analytics
- State:
- Created 4 years ago
- Reactions:1
- Comments:15 (13 by maintainers)
Top GitHub Comments
Unit tests for the win. I got my question answered as to what would be broken by doing this and was able to circumvent it with the fixes in the PR. It’s now updated and the tests pass as they should.
FYI i’m looking into the test errors right now on that PR.