angular-ui/ui-grid

Column heading menu sliding in & out causes a graphical glitch in FireFox on Windows.

Open

#4,397 opened on Sep 18, 2015

View on GitHub
 (0 comments) (0 reactions) (0 assignees)JavaScript (5,395 stars) (2,496 forks)batch import
Browser Firefoxhelp wanted

Description

As can be seen in this animated gif:

ezgif com-optimize

ui-grid column heading menu sliding in & out causes graphical glitches in FireFox on Windows.

Tested with the grid at: http://ui-grid.info/docs/#/tutorial/108_hidden_grids

Using FireFox 40.0.3 on Windows 8 SP1.

Not reproducible using Chrome or FireFox Developer's Edition, which both seem to clean up the menu image after sliding it out.

Contributor guide

Tech stack
angularjavascript
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
AngularJSCSSFirefox browser debug tools
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
40
Research direction
The issue is reproduced on the demo page http://ui grid.info/docs/#/tutorial/108 hidden grids. Investigate the column heading menu's sliding animation code, likely in the directive `uiGridHeaderMenu` or similar. Use Firefox Developer Tools to inspect the menu element after animation and identify any leftover CSS properties (e.g., `margin left`, `transform`) that cause the visual glitch. Check for cross browser differences in CSS transition behavior and ensure proper cleanup.