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

Issue 608647 link

Starred by 3 users

Issue metadata

Status: Verified
Owner:
Last visit > 30 days ago
Closed: Jul 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Chrome
Pri: 2
Type: Bug-Regression

Blocking:
issue 614588



Sign in to add a comment

Regression: Checkbox focus is not as expected in Spellcheck section of md-settings

Project Member Reported by sc00335...@techmahindra.com, May 3 2016

Issue description

Version:  52.0.2723.0 dev
OS: Ubuntu 12.04,14.04,windows

What steps will reproduce the problem?
(1) Launch chrome and go to chrome://md-settings/advanced >> Expand Spell check and hit tab so that checkbox is focused
(2) Observe highlight of checkbox.

Expected: Focus should be in form of ripple.
Actual: Instead weird focus is seen.

This is a regression issue broken in M51.

Good Build: 51.0.2703.0 dev
Bad Build: 51.0.2704.0 dev.

CHANGELOG URL:
  https://chromium.googlesource.com/chromium/src/+log/2998198ee2f8af22d01f38cc39b37b8f44fc3797..638c8ea0098d89f910142fa9c0ff69e68213cf1e

Suspecting https://codereview.chromium.org/1856873002 from changelog.

@michaelpg: Please confirm the issue.
 
Actual_checkbox focus.png
146 KB View Download
Expected_checkboxfocus.png
150 KB View Download

Comment 1 by ajha@chromium.org, May 3 2016

Didn't see the spell check option on chrome canary version:52.0.2723.0 of Mac OS 10.11.4.
Labels: -Pri-1 Pri-2
#1: As in current Options (chrome://settings), Chrome spell check is never enabled on Mac OS.
Cc: dschuyler@chromium.org
Labels: OS-Chrome
Dave, this is because of `overflow: hidden` on `.list-item > .start` in settings_shared_css.html. It would be the same if the `paper-checkbox` itself were `.start`.

You can also see in `settings-checkbox`es the very bottom part of the paper-ripple is cut off in most of our checkboxes, e.g. in privacy.
Project Member

Comment 4 by sheriffbot@chromium.org, Jun 1 2016

Labels: -M-52 M-53 MovedFrom-52
Moving this nonessential bug to the next milestone.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Cc: dbeam@chromium.org michae...@chromium.org
Owner: dschuyler@chromium.org
I don't know what the reason for having "overflow: hidden" on ".list-item > .start" is in the first place. Dave, do you have any insights?

I tracked the original addition of "overflow: hidden" to
  https://codereview.chromium.org/1652553002 
which seems to be inspired by
  https://codereview.chromium.org/1576253002
but that didn't help much.
overflow: hidden was for text lines extending off to the right hand side.
(or, preventing that text from extending off the right hand side).
Blocking: 614588
This clipping issue applies to more than just checkbox. Compare how the shadows here:
  https://screenshot.googleplex.com/oqeZnBVKfVi
are clipped. Removing a <div class="start"> makes them display normally:
  https://screenshot.googleplex.com/Wm72JHa5Eov

Can you figure out a way to elide the text in the label, without actually hiding all the overflow? Or if you're busy can we assign to someone willing/knowledgeable to work on it (I tried briefly but didn't make any progress)?
Yeah, I think there will be a way to handle
the text elision without clipping the ripples/
shadows. It's more of a question of when I'll
get to it (it may be several days).

I'll leave this bug marked 'assigned' until
I start working on it (when I'll mark it
'started'). If anyone has time to grab it,
please change the owner and mark yourself
'started').
Okay, sounds good! There's no particular rush (aside from being a blocker) if you plan to get to it. I'll just ignore any related clipping issues I see until then.
I looked into this a bit.

It's not caused by overflow: hidden. 

It's a bug in Polymer. (as seen in this jsbin: http://jsbin.com/tohisigeqi/11/edit?html,console,output)

The problem appears to be a rounding/math error in the calculation of the ripple size. An 18px checkbox doesn't show the issue, but a 16px or 15px 
checkbox will.

Hmm, well to be more clear: the clipping on the right and bottom is not overflow:hidden. I haven't tracked down the left edge clipping.
The left clipping in Manage Languages is from iron-list setting overflow: auto.

The heavy clipping in Custom Spelling is from .start overflow: hidden. As Michael pointed out above, I'd missed that.

So far, there are three separate things clipping the ink ripples.
Status: Started (was: Assigned)
I put up CL 2063453003 to fix the form of 
clipping that comes from overflow: hidden.
The other two forms of clipping haven't been
addressed yet.


Project Member

Comment 14 by bugdroid1@chromium.org, Jun 13 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/79d84b4f8c318dda15dc5708ecd871f7aafd35d2

commit 79d84b4f8c318dda15dc5708ecd871f7aafd35d2
Author: dschuyler <dschuyler@chromium.org>
Date: Mon Jun 13 21:48:17 2016

[MD settings] not clipping ink ripple in spelling settings

This CL reduces the use of overflow: hidden to places that need it,
than having it set on .start and .middle which are more about position
than elision.

BUG= 608647 
CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2063453003
Cr-Commit-Position: refs/heads/master@{#399555}

[modify] https://crrev.com/79d84b4f8c318dda15dc5708ecd871f7aafd35d2/chrome/browser/resources/settings/on_startup_page/startup_url_entry.html
[modify] https://crrev.com/79d84b4f8c318dda15dc5708ecd871f7aafd35d2/chrome/browser/resources/settings/settings_shared_css.html

Labels: Hotlist-MD-Settings-Languages
Note that the checkbox ripple is also cut off on the "All languages" list.
Project Member

Comment 17 by bugdroid1@chromium.org, Jun 15 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/79d84b4f8c318dda15dc5708ecd871f7aafd35d2

commit 79d84b4f8c318dda15dc5708ecd871f7aafd35d2
Author: dschuyler <dschuyler@chromium.org>
Date: Mon Jun 13 21:48:17 2016

[MD settings] not clipping ink ripple in spelling settings

This CL reduces the use of overflow: hidden to places that need it,
than having it set on .start and .middle which are more about position
than elision.

BUG= 608647 
CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2063453003
Cr-Commit-Position: refs/heads/master@{#399555}

[modify] https://crrev.com/79d84b4f8c318dda15dc5708ecd871f7aafd35d2/chrome/browser/resources/settings/on_startup_page/startup_url_entry.html
[modify] https://crrev.com/79d84b4f8c318dda15dc5708ecd871f7aafd35d2/chrome/browser/resources/settings/settings_shared_css.html

at least for cases like Languages where we have controls at the edges of iron-lists, we could probably get pretty far by moving the padding into the iron-list (remove the <div class="list-frame vertical-list"> wrapper, and put those classes on the iron-list directly)
Status: Fixed (was: Started)
After this was fixed, the check boxes were replaced with toggle buttons.
Status: Started (was: Fixed)
There is still an issue in the languages detail section.
Project Member

Comment 22 by bugdroid1@chromium.org, Jun 29 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/cca1a01d2fc00681e258522c6b9f8cb585636225

commit cca1a01d2fc00681e258522c6b9f8cb585636225
Author: dschuyler <dschuyler@chromium.org>
Date: Wed Jun 29 01:50:03 2016

[MD settings] checkbox ripple clipping with iron list

This CL reduces the effect of iron-list clipping off the ink ripple
effect on paper-checkbox (e.g. in the language settings). The ripple can
still be clipped on the top and bottom. This CL fixes the more noticeable
clipping on the left edge.

BUG= 608647 
CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2098123002
Cr-Commit-Position: refs/heads/master@{#402639}

[modify] https://crrev.com/cca1a01d2fc00681e258522c6b9f8cb585636225/chrome/browser/resources/settings/languages_page/manage_languages_page.html

Status: Fixed (was: Started)
Status: Verified (was: Fixed)
ChromeOS build 8530.96.0 / 53.0.2785.154

Sign in to add a comment