search

angulardart / angular_components

The official Material Design components for AngularDart. Used at Google in production apps.
https://pub.dev/packages/angular_components
372 stars 123 forks source link

MaterialTab active element problem #351

Open alescdb opened 5 years ago

alescdb commented 5 years ago

Hi,

I found a small bug in Tabs, when I click on a tab (strip/panel) and maintain the left mouse button pressed and moving the mouse outside the tab the element stay active.

In case I don't make any sense, here is a small animation:

output

>dart --version
Dart VM version: 2.1.0-dev.9.1 (Unknown timestamp) on "linux_x64"
angular: ^5.1.0
angular_components: ^0.10.0

This is also happening in the gallery : https://dart-lang.github.io/angular_components/#/material_tab

nshahan commented 5 years ago

Are you saying that the tab will not change unless you click and release over a tab? That behavior seems pretty common in UI elements. Buttons usually don't trigger unless you click and release over them.

Do you see the same behavior on the "Write" and "Preview" tabs on this GitHub page when you are composing a reply?

alescdb commented 5 years ago

The css class active is set on all "grabbed" tabs, so in most case this is only visual. I'm not seeing this on github Write/Preview tabs (and the selected class stays on the selected tab).

On other tabs implementations I've tried (Angular TS, MaterializeCSS, bootstrap) the tab it drags with the mouse. The only one that behave like MaterialTab is paper-tabs (without visual "bug") : https://www.webcomponents.org/element/@polymer/paper-tabs/demo/demo/index.html

nshahan commented 5 years ago

Ahh ok! I see what you are describing now. Sorry about the confusion. Thanks for the report.

luaVolk commented 5 years ago

The same happens with the buttons. They stay raised if the mouseup doesnt happen with the mouse on them

button active