Browser-laptop: Tab title often isn't updated until the cursor is moved over it or tab focus is changed

[srirambv]

Test plan

1. Launch Brave and use the keyboard to open preferences (cmd + , on macOS)
2. Notice that title is set properly
3. Press key combo again to open a new preferences tab
4. Notice that title is also correct
   (thanks @bbondy for the much easier repro steps! 😄 )

Also see: https://github.com/brave/browser-laptop/pull/10691#issue-253338559

---

Original issue description

• Did you search for similar issues before submitting this one?
  Yes

• Describe the issue you encountered:
  Contribution Statement opened in a new tab doesn't show the tab title until the cursor is moved over it or tab focus is changed

• Platform (Win7, 8, 10? macOS? Linux distro?):
  Windows 10 x64

• Brave Version (revision SHA):
  Brave 0.14.0
  rev 903cfea

• Steps to reproduce:

  1. Run simulated Brave payments to generate reports
  2. Click on the payment report to open it in a new tab
  3. Save the file/Close the save file prompt
  4. Tab title still retains about:contribution# until the mouse cursor is hovered over the tab or the tab focus is changed

• Actual result:
  Tab title is changed only after tab focus is lost or mouse over tab

• Expected result:
  Should show Contribution Statement when the statement file is opened

• Will the steps above reproduce in a fresh profile? If not what other info can be added?
  Yes

• Is this an issue in the currently released version?
  N/A

• Can this issue be consistently reproduced?
  Yes

• Extra QA steps:
  1.
  2.
  3.

• Screenshot if needed:

• Any related issues:

  7724

cc: @cezaraugusto

[srirambv]

This is actually the same for any about page(preference, bookmarks, history) opened with keyboard shortcuts

[srirambv]

Similar issue on opening a magnet link. On tab focus change or mouse over/away from tab shows the torrent title.

[NejcZdovc]

Also something familiar is happening when you are chatting on Facebook

[bsclifton]

The value is definitely being set... strange enough, it even shows properly in the DOM. However, it isn't triggering a re-render on the component itself ☹️

[luixxiul]

The issue is still happening on other languages than English.

STR:

1. Change language setting (eg to German)
2. Restart the browser
3. Open about:preferences ("Einstellungen") from the kabob menu
4. The tab title is set to "Preferences"
5. Hover on the tab
6. The title is changed to "Einstellungen"

[bsclifton]

Fix done with https://github.com/brave/browser-laptop/commit/fa919c0c4b7f2619b78a55b90bb178a734be18e9 doesn't offer a very good solution- often tab is empty until it loads. Reopening...

[bsclifton]

Unless there are objections, I'd like to propose moving this back. Likely the fixes being done by @NejcZdovc regarding ReduxComponent will solve this issue properly. Putting more effort on this when that work is coming soon may be a waste

[bsclifton]

co-assigned @NejcZdovc

When you start to look at ReduxComponent for tabs, let's take this use-case into account 😄

[NejcZdovc]

@bsclifton will do :smiley:

[srirambv]

Here's a screen grab of the issue on 0.15.0 RC3

[luixxiul]

The fix does not work on debian:

[bsclifton]

Pulling into 0.15.300 as this has been fixed with recent updates by @bridiver and/or @NejcZdovc 😄

[luixxiul]

Not fixed yet:

[bridiver]

this might be fixed in master. There was a rebase issue that caused a related problem.

[alexwykoff]

@luixxiul let's retest this after the new builds

[bsclifton]

Manually tested using the steps I had above- it works great 👍

[luixxiul]

it seems fixed on the latest build.

[luixxiul]

https://github.com/brave/browser-laptop/issues/8525#issuecomment-301975548

Still reproducible:

STR:

1. Clear the profile folder
2. Open about:about
3. Open about:about
4. Close the tab
5. Reopen it with the keyboard shortcut

[srirambv]

Issue still persists. Reopening it also based on https://github.com/brave/browser-laptop/issues/8525#issuecomment-301975548

[bsclifton]

Moving to 0.15.4xx

[luixxiul]

Here's another STR (I'm not quite sure the cause is same):

1. Visit https://github.com
2. Disable Shields with the lion icon
   

[luixxiul]

Yet another example (I found while testing out https://github.com/brave/browser-laptop/pull/8336#issue-221932128):

[alexwykoff]

related issue : #9000

[luixxiul]

Another STR:

1. Open about:about
2. Middle click about:about several times
3. You get about:about and Untitled

The tab which has been opened gets the correct tab title, after each new tab is opened.

Also: if you open an about page from the bookmark toolbar, you get the tab title which starts from chrome-extension.

[JaneSmith]

I believe I'm encountering this issue on version 0.18.14 on Windows 10 x64 when reading threads on https://boards.4chan.org. 4chan threads have an auto-update feature, which loads new messages and displays "(n)" in the page title to indicate the number of unread posts. When you scroll down to the bottom of the page, those posts are marked as read and the page title again changes to remove the "(n)" part.

I've noticed that the Brave window title (the text that replaces the URL bar when hidden) immediately updates when these page titles are changed, but the tab itself does not update until I either mouse-over it or focus a different tab.

It's quite annoying because if I'm on a different tab - it's harder to notice when there are new posts available to read. If I'm on a different tab like a Reddit tab, the window title will show the Reddit tab's title. The only way to see the 4chan tab's title is on the tab itself, which does not update.

[cezaraugusto]

cc @zentagonist I've just set it to 0.20.x and sprint/1 as this will be covered by #10691

[jonathansampson]

This issue, I believe, is caused by the use of _transparent_ text. The engine thinks that because the text is transparent, nothing is rendered in its place, and therefore nothing needs to be updated.

If I'm not mistaken, @cezaraugusto is changing this to use a solid color for the text, and a pseudo-element for the fading. This should resolve this problem moving forward.

[cezaraugusto]

yes that's correct and your take is exactly what is happening. React renders the title but not the browser rendering engine itself, so you end up without updates until you hover the tab, which causes a full reflow. nice catch btw!