[fix] Cleanup text measures (#3169)

This PR cleans up text measurement divs, which could pile up during HMR.

### Change Type

<!--  Please select a 'Scope' label ️ -->

- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff

<!--  Please select a 'Type' label ️ -->

- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know


### Release Notes

- Fixed a bug that could cause multiple text measurement divs in
development mode.
This commit is contained in:
Steve Ruiz 2024-03-16 07:57:17 +00:00 committed by GitHub
parent 8e23a253fc
commit 6969352aef
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -40,12 +40,19 @@ export class TextManager {
baseElm: HTMLDivElement baseElm: HTMLDivElement
constructor(public editor: Editor) { constructor(public editor: Editor) {
const container = this.editor.getContainer()
// Remove any existing text measure element that
// is a descendant of this editor's container
container.querySelector('#tldraw_text_measure')?.remove()
const elm = document.createElement('div') const elm = document.createElement('div')
elm.id = `tldraw_text_measure` elm.id = `tldraw_text_measure`
elm.classList.add('tl-text') elm.classList.add('tl-text')
elm.classList.add('tl-text-measure') elm.classList.add('tl-text-measure')
elm.tabIndex = -1 elm.tabIndex = -1
this.editor.getContainer().appendChild(elm) container.appendChild(elm)
this.baseElm = elm this.baseElm = elm
} }