OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Fix CIDER formatting buttons on Safari

pull/21833/head
Germain 2021-03-22 15:50:25 +00:00 committed by GitHub
parent 03ab2dc8e0 0db31dfeae
commit c0c8a55449
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/ciderEditor.md
View File

@ -21,14 +21,14 @@ caret nodes (more on that later).
For these reasons it doesn't use `innerText`, `textContent` or anything similar. For these reasons it doesn't use `innerText`, `textContent` or anything similar.
The model addresses any content in the editor within as an offset within this string. The model addresses any content in the editor within as an offset within this string.
The caret position is thus also converted from a position in the DOM tree The caret position is thus also converted from a position in the DOM tree
to an offset in the content string. This happens in `getCaretOffsetAndText` in `dom.js`. to an offset in the content string. This happens in `getCaretOffsetAndText` in `dom.ts`.
Once the content string and caret offset is calculated, it is passed to the `update()` Once the content string and caret offset is calculated, it is passed to the `update()`
method of the model. The model first calculates the same content string of its current parts, method of the model. The model first calculates the same content string of its current parts,
basically just concatenating their text. It then looks for differences between basically just concatenating their text. It then looks for differences between
the current and the new content string. The diffing algorithm is very basic, the current and the new content string. The diffing algorithm is very basic,
and assumes there is only one change around the caret offset, and assumes there is only one change around the caret offset,
so this should be very inexpensive. See `diff.js` for details. so this should be very inexpensive. See `diff.ts` for details.
The result of the diffing is the strings that were added and/or removed from The result of the diffing is the strings that were added and/or removed from
the current content. These differences are then applied to the parts, the current content. These differences are then applied to the parts,
@ -51,7 +51,7 @@ which relate poorly to text input or changes, and don't need the `beforeinput` e
which isn't broadly supported yet. which isn't broadly supported yet.
Once the parts of the model are updated, the DOM of the editor is then reconciled Once the parts of the model are updated, the DOM of the editor is then reconciled
with the new model state, see `renderModel` in `render.js` for this. with the new model state, see `renderModel` in `render.ts` for this.
If the model didn't reject the input and didn't make any additional changes, If the model didn't reject the input and didn't make any additional changes,
this won't make any changes to the DOM at all, and should thus be fairly efficient. this won't make any changes to the DOM at all, and should thus be fairly efficient.

2
res/css/views/rooms/_MessageComposerFormatBar.scss
View File

@ -60,6 +60,8 @@ limitations under the License.
width: 27px; width: 27px;
height: 24px; height: 24px;
box-sizing: border-box; box-sizing: border-box;
background: none;
vertical-align: middle;
} }
.mx_MessageComposerFormatBar_button::after { .mx_MessageComposerFormatBar_button::after {

4
src/components/views/rooms/MessageComposerFormatBar.js
View File

@ -85,8 +85,8 @@ class FormatButton extends React.PureComponent {
return ( return (
<AccessibleTooltipButton <AccessibleTooltipButton
as="span" element="button"
role="button" type="button"
onClick={this.props.onClick} onClick={this.props.onClick}
title={this.props.label} title={this.props.label}
tooltip={tooltip} tooltip={tooltip}