New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 785762 link

Starred by 5 users

Issue metadata

Status: Duplicate
Merged: issue 752450
Owner: ----
Closed: Dec 2017
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 2
Type: Bug-Regression



Sign in to add a comment

Latest Chrome update forces button-radius:4px

Reported by orrin.gr...@gmail.com, Nov 16 2017

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36

Steps to reproduce the problem:
1. Load any site that has buttons where webkit css is not defined
2. 
3. 

What is the expected behavior?
I do not want rounded corners

What went wrong?
user agent stylesheet
input[type="button" i], input[type="submit" i], input[type="reset" i], input[type="file" i]::-webkit-file-upload-button, button {
    border-color: rgb(216, 216, 216) rgb(209, 209, 209) rgb(186, 186, 186);
    border-radius: 4px; <<<<<<<<<<<<<<<<<<<<<<<<<<
    border-style: solid;
    border-width: 1px;
    padding: 1px 7px 2px;

Did this work before? Yes 61

Chrome version: 62.0.3202.94  Channel: stable
OS Version: OS X 10.11.6
Flash Version: 

user agent stylesheet
input[type="button" i], input[type="submit" i], input[type="reset" i], input[type="file" i]::-webkit-file-upload-button, button {
    border-color: rgb(216, 216, 216) rgb(209, 209, 209) rgb(186, 186, 186);
    border-radius: 4px; <<<<<<<<<<<<<<<<<<<<<<<<<<
    border-style: solid;
    border-width: 1px;
    padding: 1px 7px 2px;
 
Components: -UI Blink>CSS
Labels: Needs-Feedback Needs-Triage-M62
orrin.gradwell@, can you please provide a sample test case to repro?
Certainly,

When you go to https://www.capeunionmart.co.za as an example, and view the first four buttons, ("View & Buy"), you'll notice that they have border-radius: 4px;

This was not the case before...

Although I am aware that it can be mitigated by correctly catering for all browser by using webkit standards, etc... the normal guy out there does not know this thus, there are now plenty sites out there that have rounded corners where it's un-wanted.

The code snippet provided in the OP is taken from this site... 
Project Member

Comment 3 by sheriffbot@chromium.org, Nov 17 2017

Cc: manoranj...@chromium.org
Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "manoranjanr@chromium.org" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Cc: divya.pa...@techmahindra.com
Labels: Needs-Feedback Triaged-ET
Unable to reproduce the issue on reported version 62.0.3202.94 and latest Dev 64.0.3272.0 using Mac 10.12.6. Please find the attached screen-cast and let us know if we have missed any steps in the process of reproducing the issue from TE-end
Nov-20-2017-1_13-PM.mp4
1.5 MB View Download
This is indeed now the case, we had to make a fix for it as the client picked this up and was not happy.
I also have to note that we manage quite a few individual sites (56 to be exact),

I have attached a screen cast of three of our other sites that still have the issue on it.

https://drive.google.com/file/d/1QnKt1yxQ2qLSPpRvebPVXyyOo9evtaUO/view

Please let me know if you require any further information.
Nov 20 2017 4_14 PM.webm
12.8 MB View Download
Project Member

Comment 6 by sheriffbot@chromium.org, Nov 20 2017

Labels: -Needs-Feedback
Thank you for providing more feedback. Adding requester "divya.padigela@techmahindra.com" to the cc list and removing "Needs-Feedback" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
To clarify a bit - https://www.capeunionmart.co.za is now overriding the border-radius: 4px; in .button. Looking at the first screen-cast it looks like this may have been missed.
Components: -Blink>CSS Blink>HTML
Status: Needs-Feedback (was: Unconfirmed)
I am not seeing any evidence of a bug. Can you attach a minimal .html example, or link to a minimal example.

@jack, correct, we implemented a "border-radius:0" to fix the issue.
If border-radius is not defined, then border-radius: 4px is forced as shown in the screencast.

@Eric, I'm not sure what it is that you would like to see as I highlighted the issue in the screencast above.
What I can tell is that since Chrome updated, All our sites now have border-radius: 4px applied to .button. if border-radius is not defined...
You can view https://www.treadandmiller.co.za/ and inspect all buttons. (VIEW & BUY)
Here is a minimal reproduction: https://codepen.io/anon/pen/gXegyY

I have attached a screenshot of the unexpected style.

macOS 10.12.6 (16G29)/Chrome 62.0.3202.94
Screen Shot 2017-11-21 at 10.44.56 AM.png
155 KB View Download
I have been able to reproduce the 4px border radius with the following configurations:

macOS 10.12.6 / Chrome 62.0.3202.94
macOS 10.13.1 / Chrome 62.0.3202.94

I have _not_ been able to reproduce the 4px border radius with the following configuration:

win 7 SP1 (7601) / Chrome 62.0.3202.94

This issue is a dup of https://bugs.chromium.org/p/chromium/issues/detail?id=752450

The border-radius has been reverted here https://chromium.googlesource.com/chromium/src.git/+/f764659b2235005f9e1f6c5a86fd27716a6bad38%5E%21/#F96

I can confirm this is no longer an issue in Canary (64.0.3274.0). I am not too familiar with the release channels but I assume this can't/won't be cherry picked into stable?


Comment 14 by kochi@chromium.org, Dec 27 2017

Components: -Blink>HTML Blink>Forms>Button
Mergedinto: 752450
Status: Duplicate (was: Needs-Feedback)
Merging to 752450 per comment 13.

M64 will be released to stable channel late Jan, 2018 (next month).

Comment 15 by kochi@chromium.org, Dec 27 2017

It looks the change was merged to M63, so it should be fixed on the stable
channel now.

Sign in to add a comment