Fixes#149

[t-soares]

Fixes issue #149.

Reproduce the issue:

1. https://jsfiddle.net/thisoares/0910ac0y/
2. Click on the "Open Right Drawer" button. The drawer will appear from the left.

• The drawer is opening is animated using a transition for the transform CSS property.
• When the drawer is on the left, the transition is from transform: translateX(-100%) to transform: none when the drawer is opened;
• When the drawer is on the right, the transition is from transform: translateX(100%) to transform: none when the drawer is opened;
• The transition duration is 0.3s.
• If the rightDrawer is changed before opening the drawer, a transition will start:
  • from transform: translateX(-100%) to transform: translateX(100%) if changing rightDrawer from left to right.
  • from transform: translateX(100%) to transform: translateX(-100%) if changing rightDrawer from right to left.
• Before the previous transition ends, we open the drawer. This causes a new end to the transition started in the left step.

Solution: Disabled the drawer transition and enable it only on opening/closing the drawer.

Run the fix: https://jsfiddle.net/thisoares/rdjxmax4/ @blasten @minhlong139

[blasten]

@thisoares thanks for the update. A few tests are failing. Probably those assertions need to go inside a rAF callback.

[t-soares]

I agree that it is bad for performance. I changed the proposed solution. Instead of disabling the transition when changing the rightDrawer attribute, I disabled the drawer transition and enable it only when opening/closing the drawer. Thanks @blasten .

[blasten]

LGTM. Thanks!