WIP Fix flicker when user mouses over the very leftmost edge of party member avatar (#10407)

* added 1px margin-right to .member-stats * added unit test for flicker prevention style * remove .only() from unit test * rewrote margin test using computed style
2018-06-27 10:07:21 -07:00
parent bd5c4a08e2
commit 61001d0e9a
2 changed files with 24 additions and 0 deletions
@@ -0,0 +1,23 @@
+import Vue from 'vue';
+import MemberDetailsComponent from 'client/components/memberDetails.vue';
+
+describe('Members Details Component', () => {
+  let CTor;
+  let vm;
+
+  beforeEach(() => {
+    CTor = Vue.extend(MemberDetailsComponent);
+    vm = new CTor().$mount();
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  it('prevents flickering by setting a 1px margin-right on elements of class member-stats', () => {
+    const memberstats = vm.$el.querySelector('.member-stats');
+    const style = window.getComputedStyle(memberstats, null);
+    const marginRightProp = style.getPropertyValue('margin-right');
+    expect(marginRightProp).to.equal('1');
+  });
+});