Merge branch 'master' into handle-delete-composition-helper

This commit is contained in:
Ian K
2022-08-21 09:26:45 -05:00
committed by GitHub
3 changed files with 14 additions and 13 deletions
-1
View File
@@ -2,7 +2,6 @@
An addon for [xterm.js](https://github.com/xtermjs/xterm.js) that enables a WebGL2-based renderer. This addon requires xterm.js v4+. An addon for [xterm.js](https://github.com/xtermjs/xterm.js) that enables a WebGL2-based renderer. This addon requires xterm.js v4+.
### Install ### Install
```bash ```bash
@@ -439,9 +439,8 @@ export class WebglCharAtlas implements IDisposable {
if (underline) { if (underline) {
this._tmpCtx.save(); this._tmpCtx.save();
const lineWidth = Math.max(1, Math.floor(this._config.fontSize * window.devicePixelRatio / 15)); const lineWidth = Math.max(1, Math.floor(this._config.fontSize * window.devicePixelRatio / 15));
// When the width is odd, draw at 0.5 position. Offset by an additional 1 dpr to bring the // When the line width is odd, draw at a 0.5 position
// underline closer to the character const yOffset = lineWidth % 2 === 1 ? 0.5 : 0;
const yOffset = (lineWidth % 2 === 1 ? 0.5 : 0) + window.devicePixelRatio;
this._tmpCtx.lineWidth = lineWidth; this._tmpCtx.lineWidth = lineWidth;
// Underline color // Underline color
@@ -463,9 +462,9 @@ export class WebglCharAtlas implements IDisposable {
this._tmpCtx.beginPath(); this._tmpCtx.beginPath();
const xLeft = padding; const xLeft = padding;
const xRight = padding + this._config.scaledCellWidth; const xRight = padding + this._config.scaledCellWidth;
const yTop = Math.ceil(padding + this._config.scaledCharHeight - lineWidth) - yOffset; const yTop = Math.ceil(padding + this._config.scaledCharHeight) - yOffset;
const yMid = padding + this._config.scaledCharHeight - yOffset; const yMid = padding + this._config.scaledCharHeight + lineWidth - yOffset;
const yBot = Math.ceil(padding + this._config.scaledCharHeight + lineWidth) - yOffset; const yBot = Math.ceil(padding + this._config.scaledCharHeight + lineWidth * 2) - yOffset;
switch (this._workAttributeData.extended.underlineStyle) { switch (this._workAttributeData.extended.underlineStyle) {
case UnderlineStyle.DOUBLE: case UnderlineStyle.DOUBLE:
this._tmpCtx.moveTo(xLeft, yTop); this._tmpCtx.moveTo(xLeft, yTop);
@@ -528,8 +527,9 @@ export class WebglCharAtlas implements IDisposable {
this._tmpCtx.restore(); this._tmpCtx.restore();
// Draw stroke in the background color for non custom characters in order to give an outline // Draw stroke in the background color for non custom characters in order to give an outline
// between the text and the underline // between the text and the underline. Only do this when font size is >= 12 as the underline
if (!customGlyph) { // looks odd when the font size is too small
if (!customGlyph && this._config.fontSize >= 12) {
// This only works when transparency is disabled because it's not clear how to clear stroked // This only works when transparency is disabled because it's not clear how to clear stroked
// text // text
if (!this._config.allowTransparency && chars !== ' ') { if (!this._config.allowTransparency && chars !== ' ') {
+6 -4
View File
@@ -24,10 +24,12 @@ export function observeDevicePixelDimensions(element: HTMLElement, callback: (de
return; return;
} }
callback( // Fire the callback, ignore events where the dimensions are 0x0 as the canvas is likely hidden
entry.devicePixelContentBoxSize[0].inlineSize, const width = entry.devicePixelContentBoxSize[0].inlineSize;
entry.devicePixelContentBoxSize[0].blockSize const height = entry.devicePixelContentBoxSize[0].blockSize;
); if (width > 0 && height > 0) {
callback(width, height);
}
}); });
observer.observe(element, { box: ['device-pixel-content-box'] } as any); observer.observe(element, { box: ['device-pixel-content-box'] } as any);
return toDisposable(() => observer?.disconnect()); return toDisposable(() => observer?.disconnect());