Add bidirectonal isolation for pills (#8985)

This commit is contained in:
sha-265 2022-07-05 14:37:35 +03:00 committed by GitHub
parent 74a059b520
commit a009f8001a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 6 additions and 8 deletions

View File

@ -256,7 +256,7 @@ export default class Pill extends React.Component<IProps, IState> {
tip = <Tooltip label={resource} alignment={Alignment.Right} />;
}
return <MatrixClientContext.Provider value={this.matrixClient}>
return <bdi><MatrixClientContext.Provider value={this.matrixClient}>
{ this.props.inMessage ?
<a
className={classes}
@ -264,7 +264,6 @@ export default class Pill extends React.Component<IProps, IState> {
onClick={onClick}
onMouseOver={this.onMouseOver}
onMouseLeave={this.onMouseLeave}
dir="auto"
>
{ avatar }
<span className="mx_Pill_linkText">{ linkText }</span>
@ -274,13 +273,12 @@ export default class Pill extends React.Component<IProps, IState> {
className={classes}
onMouseOver={this.onMouseOver}
onMouseLeave={this.onMouseLeave}
dir="auto"
>
{ avatar }
<span className="mx_Pill_linkText">{ linkText }</span>
{ tip }
</span> }
</MatrixClientContext.Provider>;
</MatrixClientContext.Provider></bdi>;
} else {
// Deliberately render nothing if the URL isn't recognised
return null;

View File

@ -329,13 +329,13 @@ describe("<TextualBody />", () => {
const content = wrapper.find(".mx_EventTile_body");
expect(content.html()).toBe(
'<span class="mx_EventTile_body markdown-body" dir="auto">' +
'A <span><a class="mx_Pill mx_RoomPill" ' +
'A <span><bdi><a class="mx_Pill mx_RoomPill" ' +
'href="https://matrix.to/#/!ZxbRYPQXDXKGmDnJNg:example.com' +
'?via=example.com&amp;via=bob.com" dir="auto"' +
'?via=example.com&amp;via=bob.com"' +
'><img class="mx_BaseAvatar mx_BaseAvatar_image" ' +
'src="mxc://avatar.url/room.png" ' +
'style="width: 16px; height: 16px;" alt="" aria-hidden="true">' +
'<span class="mx_Pill_linkText">room name</span></a></span> with vias</span>',
'<span class="mx_Pill_linkText">room name</span></a></bdi></span> with vias</span>',
);
});

View File

@ -14,4 +14,4 @@ exports[`<TextualBody /> renders formatted m.text correctly pills do not appear
</span>"
`;
exports[`<TextualBody /> renders formatted m.text correctly pills get injected correctly into the DOM 1`] = `"<span class=\\"mx_EventTile_body markdown-body\\" dir=\\"auto\\">Hey <span><a class=\\"mx_Pill mx_UserPill\\" dir=\\"auto\\"><img class=\\"mx_BaseAvatar mx_BaseAvatar_image\\" src=\\"mxc://avatar.url/image.png\\" style=\\"width: 16px; height: 16px;\\" alt=\\"\\" aria-hidden=\\"true\\"><span class=\\"mx_Pill_linkText\\">Member</span></a></span></span>"`;
exports[`<TextualBody /> renders formatted m.text correctly pills get injected correctly into the DOM 1`] = `"<span class=\\"mx_EventTile_body markdown-body\\" dir=\\"auto\\">Hey <span><bdi><a class=\\"mx_Pill mx_UserPill\\"><img class=\\"mx_BaseAvatar mx_BaseAvatar_image\\" src=\\"mxc://avatar.url/image.png\\" style=\\"width: 16px; height: 16px;\\" alt=\\"\\" aria-hidden=\\"true\\"><span class=\\"mx_Pill_linkText\\">Member</span></a></bdi></span></span>"`;