hyper
hyper copied to clipboard
Hyper term Canary build show black spot on macOS
- [X ] I am on the latest Hyper.app version
- [X ] I have searched the issues of this repo and believe that this is not a duplicate
- OS version and name: macOS 12.2.1
- Hyper.app version: Canary 3.3.0
- Link of a Gist with the contents of your .hyper.js:
- Relevant information from devtools (CMD+ALT+I on macOS, CTRL+SHIFT+I elsewhere): <img width="1338" alt="image" src="https://user-images.githubusercontent.com/11479557/154517605-e709c854-ce5a-4a1c-8a2e-43fb6feba263.png"
Issue
Hello Expert, hyper term canary latest build running on macOS 12.2 showing black spot. you can check the below screenshot for reference can someone help how to fix it.

Any update on this experts
does it also happen if you try without the plugins? You may try combinations of the configs disableLigatures
and webGLRenderer
I switched to Stable release and not seeing issue so far.. i am not using ligature and webGLrenderer is on default setting .... it seems a bug to me
Hi Experts,
now i am seeing the black dot issue on stable release also very weird. Don't know team is interested or not but i am sharing the screenshot of issue

In below screenshot black spot is too much

Hi Hyper Experts,
Any one address this problem.. it's annoying day by day and worst thing the support team also not helping on this. What's the point of reporting issue when no one entertain

@LabhanshAgrawal Hi Labhansh, I need your help on this issue my friend. I have disabled mostly all plugin except them theme one still having this black dot issue and this issue is happening on both stable as well as canary build. what the point of reporting issue if no one from hyper team going to entertain and help user.
Please do help me to this annoying issue
@ciscohack can you post your full config?
@ciscohack can you post your full config?
here you go my friend.. i hope you will fix the issue
Hi @LabhanshAgrawal, I hope you have looked up this annoying issue any workaround you know to address it. it's really distracting my focus and work. i badly need some fix or workaround to overcome this issue and i know only you can help me.

Hey @ciscohack I understand that this issue affects the usability a lot for you. I checked the config you've sent and wasn't really able to reproduce the issue. It will need some time to dig deeply. But I'm really caught up with work and other things these days. Your patience is appreciated.
One thing you can surely try is to set webGLRenderer: false
and see if that helps.
Also might want to try the default font config.
One thing you can surely try is to set
webGLRenderer: false
and see if that helps. Also might want to try the default font config.
Thanks for the response. webGLRenderer: false
this setting i can surely try but font config i don't understand. I am using nerd font and it was working fine in older versions. Second i don't understand how font can cause black spot
I do see people having rendering issues sometimes due to their fonts, so it is something that might be useful to check. You can get the default value for it from https://github.com/vercel/hyper/blob/canary/app/config/config-default.js
Since you have seen the issue .. i will test and update you but one question as per default config and description webGLRenderer setting is true and if i set it to false as per below description it will reduce the performance i mean render will be slow. so false is not idle setting
// Whether to use the WebGL renderer. Set it to false to use canvas-based // rendering (slower, but supports transparent backgrounds) webGLRenderer: true,
if i use default font then my zsh will not render the icons correctly .. see the below screenshot when i switch to default font.

These sort of rendering issues started recently with xterm's update, they've fixed it somewhat but I guess some of it is still there. This was mostly on the webGL renderer, so you should be able to use canvas renderer for now, and switch back to webGL when it's fully fixed. For the font thing, just want to check if it happens with the default config or not. You can get the zsh icons with other nerd fonts also, in case the current one was the issue.
@LabhanshAgrawal Thanks for the info. I tried other nerd fonts and all have issue.. I am sure the issue with Hyper term render only
@LabhanshAgrawal An observation for you changing webGLRenderer setting to false seems solving the problem but this has some terminal performance trade off very minor but it has. But good thing for moment it solving the problem so far not seen the black spot .. i used hyper term less in these days but seems it's working
@LabhanshAgrawal Okay i have started using hyperterm again for long hour work and noticed with webGLRenderer: false setting also black dot is coming. Issue in false condition is happen little slow and less aggression as compare to config "webGLRenderer: true" config. This is serious problem with our hyperterm and need attention first to resolve it. need your attention and help on this.

@ciscohack can you try the demo from https://github.com/xtermjs/xterm.js and check if it happens in that as well. We directly use xterm for rendering.
@ciscohack can you try the demo from https://github.com/xtermjs/xterm.js and check if it happens in that as well. We directly use xterm for rendering.
@LabhanshAgrawal Thanks for the update. I am travelling no access to device. btw do i need to just install "npm install xterm" rest hyper term automatically use or do i need to follow all import and any specific setting
Clone the xterm repo and follow https://github.com/xtermjs/xterm.js/wiki/Contributing#running-the-demo
This appears to be related to fatter nerd font characters. Also seeing this issue all nerd font characters that are wider than the standard character size.
@ml653 I don't think this is a nerd font issue. it's happening with almost all font types