Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Links get wrong position when they are after wide chars with canvas/webgl renderer

See original GitHub issue

See the image below. Note that it only happens to the links detected by the weblinks addon but not OSC 8 links. It also only happens to webgl and canvas renderers but the dom one.

I looked at the code a bit. It seems that the web link addon uses the character position (i.e. “哈” is counted 1 even though it is a wide character) as the the value for IBufferCellPosition.x. Code here. Is this the correct way?

BTW, I am not sure whether this is just #2887.

Details

Browser and browser version: Chrome 110
xterm.js version: Tot

Issue Analytics

State:
Created 9 months ago
Comments:5 (3 by maintainers)

Top GitHub Comments

1reaction

jerchcommented, Dec 8, 2022

@JasonXJ Should work now (plz report in https://github.com/xtermjs/xterm.js/pull/4288, if something is still totally off 🤞)

0reactions

jerchcommented, Dec 8, 2022

Can I expect this to be merged soon?

Well it still needs some more test cases, I kinda turned the whole regexp upside-down to also match unicode chars in paths (nowadays supported by all browsers), but this makes match exclusions a bit more cumbersome.

There is still some rendering issue with the DOM renderer …

Had to fix the DOM renderer offset calc (was totally off with correct cell positions), seems there is still a one off issue at the end of underline.

Top Results From Across the Web

Render multiple video streams in one WebGL canvas

trying 25 players/canvases. For 5 players the browser can handle it, adding more crashes the browser (tested with Chrome/Firefox). I'm wondering ...

An introduction to Three.js – The Humaan Blog

It lets you access a computer's specialised graphics hardware using JavaScript, and render the output to a webpage in a regular old <canvas> ......

Learning Pixi - GitHub

A step-by-step introduction to making games and interactive media with the Pixi.js rendering engine. - GitHub - kittykatattack/learningPixi: A step-by-step ...

How to Build a Color Customizer App for a 3D Model with ...

In this tutorial you'll learn how to create a customizer app that lets you change the colors of a 3D model of a...

Drawing graphics - Learn web development | MDN

This article will focus mainly on 2D canvas, as raw WebGL code is very complex. We will however show how to use a...