Issue metadata
Sign in to add a comment
|
Cloud Shell only shows a single small line |
||||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36 Steps to reproduce the problem: Launch Cloud Shell - https://console.cloud.google.com/cloudshell What is the expected behavior? It looks like a terminal and Enter shows the next line. What went wrong? There is one single small line, no matter how many times you press Enter. All of the lines are rendered at the same place in the screen and you cannot read the line because it is too small and cropped. Did this work before? Yes 58 Does this work in other browsers? N/A Chrome version: 59.0.3071.115 Channel: stable OS Version: 6.1 (Windows 7, Windows Server 2008 R2) Flash Version: The problem is that --hterm-charsize-width and --hterm-charsize-height are set to 0px. This happens because things are appended to an iFrame that is inside a hidden element (<div id="terminal" style="display: none;">) and then the size is calculated based on some client sizes from the appended things. https://ssh.cloud.google.com/jsfiles/hterm.js?authuser=0 - line 3064 - hterm.ScrollPort.prototype.measureCharacterSize I verified that removing display: none from that hidden element resolves the issue, so something is not laid out or its style is not computed when it is hidden, but in Chrome 58, it was. I tried to reproduce it using a vanilla version of hterm, but it did not reproduce - https://rawgit.com/phistuck/hterm-test/master/hterm/hterm11.html
,
Jul 1 2017
I think it is somehow related to the fact that my Windows scale factor is set to 200%. Adding --force-device-scale-factor=1 does not fix it. Variations ca7e5485-3f4a17df 241fff6c-4eda1c57 3095aa95-3f4a17df 6c43306f-ca7d8d80 7c1bc906-f55a7974 1c752ce9-33c3eba5 d43bf3e5-3d47f4f4 ba3f87da-45bda656 cf558fa6-48a16532 5ca89f9-ca7d8d80 f3499283-7711d854 9e201a2b-1359b0af 6eb432aa-ca7d8d80 9bd94ed7-b1c9f6b0 9773d3bd-ca7d8d80 b22b3d54-1c15b2e9 2e109477-f3b42e62 99144bc3-f22f592b 9e5c75f1-51efb9f9 f79cb77b-3d47f4f4 b7786474-d93a0620 9591f600-d93a0620 27219e67-b2047178 23a898eb-e0e2610f 4ea303a6-ecbb250e 7aa46da5-669a04e0 64224f74-5087fa4a 56302f8c-ca7d8d80 cac0a91c-3f4a17df 2697ea25-ca7d8d80 b2f0086-93053e47 6844d8aa-669a04e0 494d8760-3d47f4f4 f47ae82a-86f22ee5 3ac60855-486e2a9c f296190c-9d9eea77 4442aae2-a90023b1 ed1d377-e1cc0f14 75f0f0a0-a5822863 e2b18481-7158671e e7e71889-e1cc0f14 288c530e-3fc362e4 61b920c1-ca7d8d80 828a5926-71de01c2 a88c475d-3d47f4f4
,
Jul 6 2017
Sounds like one of the interventions to delay/throttle offscreen iframes might have caused this.
,
Jul 6 2017
fwiw, phistuck is just a random downstream of the real hterm project which is maintained here i wonder if adding an event listener on the div element like "onresize" to automatically call the sync logic would work
,
Jul 6 2017
We never throttle display:none frames because several sites tend to do things like this. Still, would you mind checking if --disable-blink-features=RenderingPipelineThrottling makes things work?
,
Jul 7 2017
#5 - I tried and no, it behaves the same with the flag. :(
,
Jul 7 2017
Thanks for checking. This must be caused by something else then :P A bisect would be useful I think.
,
Jul 7 2017
Also, looks like resizing the window does call measureCharacterSize, but it does not call setFontSize, so it does not help (sounds weird). However, I did find a workaround - focusing on the terminal itself and pressing Control + + and Control + 0 (hterm.Keyboard.KeyMap.prototype.onPlusMinusZero_) does call setFontSize and the problem goes away.
,
Jul 7 2017
phistuck: btw i tried the test page you referenced in comment #0 and it doesn't seem to show anything at all ... i'm not sure why setFontSize is needed. the actual px size of the font shouldn't have changed. does a call to syncCharacterSize instead of measureCharacterSize work ? i would try attaching some event listeners to the rulerSpan_ and have it call those funcs to see if any help.
,
Jul 7 2017
#9 - you must have an Google Cloud Platform application for the Cloud Shell to work. I have a standard Google App Engine application (it is free). In the Google Cloud Console - https://console.cloud.google.com/ - click on the >_ icon on the right top corner. Regarding setFontSize, I meant this one - hterm.Terminal.prototype.setFontSize Because this one sets the CSS custom properties (which are set to 0 when this issue reproduces). So hterm.ScrollPort.prototype.syncCharacterSize would not help here, because it does not affect the CSS custom properties.
,
Jul 7 2017
#9 - oh, you meant https://rawgit.com/phistuck/hterm-test/master/hterm/hterm11.html - yes, it is indeed blank, but the CSS custom properties are not 0, so that was enough for my test.
,
Jul 7 2017
i'm familiar with cloud shell ... i've used it before. and that link works (although i'm using Linux here, not Windows). i was referring to the link to (presumably) your site: https://rawgit.com/phistuck/hterm-test/master/hterm/hterm11.html i'm not seeing where the call chain goes wrong. - hterm.Terminal.decorate calls this.setFontSize(this.prefs_.get('font-size')) - this.prefs_.get('font-size') returns an integer from the user's prefs and should not be 0 - hterm.Terminal.setFontSize calls hterm.ScrollPort.setFontSize(px) - the px here is an actual integer and not 0 - hterm.ScrollPort.setFontSize sets this.screen_.style.fontSize to px and calls hterm.ScrollPort.syncCharacterSize - now we get into hterm.ScrollPort.measureCharacterSize which creates the custom hidden div with long lines to calculate the sizes so how did the font size get set to 0 ?
,
Jul 7 2017
Well, my operating system and DPI could be the culprit - Windows 7 Home Premium with 200% DPI.
(Though I am using --force-device-scale-factor=1 so 200% does not affect Chrome, but with or without that flag, it still reproduces)
I have not checked ScrollPort.setScrollSize, but
this.document_.documentElement.style.setProperty("--hterm-charsize-width", this.scrollPort_.characterSize.width + "px");
this.document_.documentElement.style.setProperty("--hterm-charsize-height", this.scrollPort_.characterSize.height + "px");
Set to 0.
So this one (in measureCharacterSize) fails -
var rulerSize = hterm.getClientSize(this.rulerSpan_), size = new hterm.Size(rulerSize.width / 100, rulerSize.height / 100);
Also, here it might not be an integer (because of the division).
I guess this.rulerSpan_.getBoundingClientRect() returns {width: 0, height: 0, ...}.
I am not near that computer right now, but I will check that soon.
,
Jul 7 2017
Good news - it does not reproduce anymore. I checked the about:version variations and they are different from comment 0 (a browser restart refreshes them sometimes) - ca7e5485-3f4a17df 241fff6c-4eda1c57 3095aa95-3f4a17df 6c43306f-ca7d8d80 7c1bc906-f55a7974 1c752ce9-33c3eba5 d43bf3e5-ad6ab04f ba3f87da-45bda656 cf558fa6-48a16532 5ca89f9-ca7d8d80 f3499283-7711d854 9e201a2b-1359b0af 9bd94ed7-b1c9f6b0 9773d3bd-ca7d8d80 b22b3d54-1c15b2e9 2e109477-f3b42e62 99144bc3-f22f592b 9e5c75f1-51efb9f9 f79cb77b-3d47f4f4 b7786474-d93a0620 9591f600-d93a0620 27219e67-b2047178 23a898eb-e0e2610f 4ea303a6-ecbb250e 7aa46da5-669a04e0 64224f74-5087fa4a 56302f8c-ca7d8d80 cac0a91c-3f4a17df 2697ea25-ca7d8d80 b2f0086-93053e47 6844d8aa-669a04e0 494d8760-3d47f4f4 f47ae82a-86f22ee5 3ac60855-486e2a9c f296190c-9d9eea77 4442aae2-a90023b1 ed1d377-e1cc0f14 75f0f0a0-a5822863 e2b18481-7158671e e7e71889-e1cc0f14 288c530e-3fc362e4 61b920c1-ca7d8d80 828a5926-71de01c2 a88c475d-3d47f4f4 The difference is - -d43bf3e5-ad6ab04f +d43bf3e5-3d47f4f4 +6eb432aa-ca7d8d80 Can you decipher those (is there a place that can tell me the meaning of each pair?)?
,
Jul 14 2017
,
Jul 31 2017
,
Jun 4 2018
|
|||||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||||
Comment 1 by phistuck@chromium.org
, Jun 30 2017Status: Untriaged (was: Unconfirmed)