Just came across this as well, have to say this was quite unintuitive for me as a new user. You have to dig through a lot of configuration references to figure out how this works, and do pretty good QA on a specific device before you realize that your Android users aren’t getting the platform default behavior, but instead they see the brand color of a technology that is unrelated to their user experience (so end users just see weird bright green for no apparent reason).
I had even gone through
manifest.json upon my initial setup and thought nothing of it, and only much later came to find out that I actually have Vue’s theme color in use on my mobile device even though I knew I had changed it.
For me setting the value in
vue.config.js ultimately did the trick, and also affected some of the other meta tags:
<meta name=theme-color content=#000000>
<link rel=mask-icon href=/img/icons/safari-pinned-tab.svg color=#000000>
<meta name=msapplication-TileColor content=#000000>
My next question is though, what’s the appropriate way to cancel all of this behavior? Should I pass
null to ensure my users get the default behavior on each platform?
To be honest this is a pretty clear case of a bad default. It’s one thing if this default was visible in the codebase somewhere but it’s not. Like I can understand a default stylesheet for a hello world page, that demonstrates functionality to the user, but it’s not like you can look for this color value in your project and change/remove it.
I can’t see any reason why such a complicated, obscure, hard-to-understand and barely documented set of features is toggled with Vue’s brand color by default. How many users and projects would actually want to use this color specifically? I can totally see a lot of people merrily rolling this green into production before realizing they have to fix it and go through the trouble of finding out that this one non-obvious configuration variable is what they need to change, instead of the value they actually see in their codebase.
Can’t see any benefit to this, and a much more sensible default would be to default to
null and leave out the theme color-related meta information unless the user has explicitly set their own color. That way there’s at least no surprises.