Beta/Dev build UI issues on Manjaro/Arch Linux

[Brave-Matt]

Description

I've been getting reports on Community of Manjaro and Arch Linux users using Brave that encounter a bug in the Shields dropdown:

So far it looks like this is specific to the Shields panel dropdown/extension. The issue has persisted across updates, first report of this was at Beta launch.

Steps to Reproduce

1. Install Brave Beta/Dev on Manjaro/Arch Linux machine
2. Try to open Shields panel

Actual result:

Shields panel displays incorrectly - no visible text

Expected result:

Shields panel should display properly.

Reproduces how often:

Easily

Brave version (chrome://version info)

All Beta/Dev builds released so far

Reproducible on current release:

• Does it reproduce on brave-browser dev/beta builds? Yes
• Does it reproduce on browser-laptop? No

Website problems only:

• Does the issue resolve itself when disabling Brave Shields? No
• Is the issue reproducible on the latest version of Chrome? No

Additional Information

Original posts:
https://community.brave.com/t/text-color-sometimes-renders-white-in-pages-and-always-in-the-brave-button/34687/2
https://community.brave.com/t/brave-shield-ui-bug/33570/3

A couple more screenshots:

[enderger]

This bug also occurs on some websites, like pastebin. It renders on highlighting, revealing that the bug is actually a broken default CSS text color

[enderger]

Ill screenshot pastebin when I get home

[enderger]

Or it’s pamac-based installation(I use pamac on normal arch, and pamac is the package management gui on Manjaro, so unless another method of install was used on Manjaro to replicate this, it may be the issue)

[AtjonTV]

I got the same issues

I only tested beta 0.55.6, beta 0.55.13 and dev 0.56.3 and all have the same issue

Extended OS details:

Distribution: elemetary OS
Distribution Version: 0.4.1 Loki
Base Distribution: Ubuntu 16.04.5
Kernel: Linux 4.15.0-36-generic

[enderger]

Did you use pamac or anything relating to the AUR

[enderger]

Or did you loose network for any reason at any time during the install

[AtjonTV]

I downloaded the package from the Github release list, extracted it and started the browser via the Terminal.

I did not use APT because the repo seams to be dead when i try to access it (maby because all apt traffic runns through a cache on my local network).

But still, this should not look like that. right?

[enderger]

Could be that a part of the data that is missing from running from pamac installation is missing in your download

[enderger]

Can someone with a working copy of the latest beta shoot me a checksum, we could compare

[enderger]

To the checksum in the aur or one generated on download

Sha256 or another algorithm could be good

[AtjonTV]

This is the sha256 hash of a freshly downloaded copy:

e4955451a11aa1c9bd58457bf0926e7a39c184ced017049024bb135e369cd0cd

This is the file i downloaded: brave-v0.55.14-linux-x64.zip

That version also has the same issues.

[rebron]

looking to fix this with: #1339

[cdfa]

Updated to v0.56.7 and there is still no text.

[simonorono]

This bug is still present in version 0.56.15 (installed via this AUR package).

Tested on Manjaro Linux x86_64
Linux version 4.19.2

[Brave-Matt]

+1 from Community, thanksgiving update:
https://community.brave.com/t/brave-shield-ui-bug/33570/48?u=mattches

[simonhong]

Rewards popup also has same issue.
The difference between shields and rewards popup is rewards popup displays i18n: xxx when translated message isn't available.

i18n: xxxx is displayed in rewards because chrome.i18n.getMessage() returns null in brave/components/brave_rewards/resources/extension/brave_rewards/background/api/locale_api.ts.

export const getMessage = (message: string, substitutions?: string[]): string => {
  if (chrome.i18n) {
    let translated = chrome.i18n.getMessage(message, substitutions)

    if (translated) {
      return translated
    } else {
      return `i18n: ${message}`
    }
  }

  return `i18n missing: ${message}`
}

However, shields extension does nothing when error occurs in brave/vendor/brave-extension/app/background/api/localeAPI.ts.

export const getMessage = (message: string): string => {
  if (chrome.i18n) {
    return chrome.i18n.getmessage(message)
  }

  return message
}

[simonhong]

Related docs: https://developer.chrome.com/extensions/i18n

[simonhong]

Found the reason. Zip file didn't include extension's locale files.
They are in out/Release/resources/.

[srirambv]

Verification passed on

Note: The package I built kept failing so used the AUR package available for beta to test