Improved Var Caching, Line Setup, Specs
This commit is contained in:
parent
8e828bef98
commit
667cd6257e
|
@ -39,7 +39,8 @@
|
|||
|
||||
computed: {
|
||||
cssClass() {
|
||||
return `${gl.text.dasherize(this.actionIcon)} js-icon-${gl.text.dasherize(this.actionIcon)}`;
|
||||
const actionIconDash = gl.text.dasherize(this.actionIcon)
|
||||
return `${actionIconDash} js-icon-${actionIconDash}`;
|
||||
},
|
||||
},
|
||||
};
|
||||
|
@ -53,7 +54,6 @@
|
|||
class="ci-action-icon-container ci-action-icon-wrapper"
|
||||
:class="cssClass"
|
||||
data-container="body">
|
||||
<icon
|
||||
:name="actionIcon"/>
|
||||
<icon :name="actionIcon"/>
|
||||
</a>
|
||||
</template>
|
||||
|
|
|
@ -48,7 +48,6 @@
|
|||
class="ci-action-icon-wrapper js-ci-status-icon"
|
||||
data-container="body"
|
||||
aria-label="Job's action">
|
||||
<icon
|
||||
:name="actionIcon"/>
|
||||
<icon :name="actionIcon"/>
|
||||
</a>
|
||||
</template>
|
||||
|
|
|
@ -1,41 +1,44 @@
|
|||
import Vue from 'vue';
|
||||
import Icon from '~/vue_shared/components/icon.vue';
|
||||
|
||||
const IconComponent = Vue.extend(Icon);
|
||||
import mountComponent from '../../helpers/vue_mount_component_helper';
|
||||
|
||||
describe('Sprite Icon Component', function () {
|
||||
describe('Initialization', function () {
|
||||
let icon;
|
||||
|
||||
beforeEach(function () {
|
||||
this.propsData = {
|
||||
const IconComponent = Vue.extend(Icon);
|
||||
|
||||
icon = mountComponent(IconComponent, {
|
||||
name: 'test',
|
||||
size: 99,
|
||||
cssClasses: 'extraclasses',
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
this.icon = new IconComponent({
|
||||
propsData: this.propsData,
|
||||
}).$mount();
|
||||
afterEach(() => {
|
||||
icon.$destroy();
|
||||
});
|
||||
|
||||
it('should return a defined Vue component', function () {
|
||||
expect(this.icon).toBeDefined();
|
||||
expect(icon).toBeDefined();
|
||||
});
|
||||
|
||||
it('should have <svg> as a child element', function () {
|
||||
expect(this.icon.$el.tagName).toBe('svg');
|
||||
expect(icon.$el.tagName).toBe('svg');
|
||||
});
|
||||
|
||||
it('should have <use> as a child element with the correct href', function () {
|
||||
expect(this.icon.$el.firstChild.tagName).toBe('use');
|
||||
expect(this.icon.$el.firstChild.getAttribute('xlink:href')).toBe(`${gon.sprite_icons}#test`);
|
||||
expect(icon.$el.firstChild.tagName).toBe('use');
|
||||
expect(icon.$el.firstChild.getAttribute('xlink:href')).toBe(`${gon.sprite_icons}#test`);
|
||||
});
|
||||
|
||||
it('should properly compute iconSizeClass', function () {
|
||||
expect(this.icon.iconSizeClass).toBe('s99');
|
||||
expect(icon.iconSizeClass).toBe('s99');
|
||||
});
|
||||
|
||||
it('should properly render img css', function () {
|
||||
const classList = this.icon.$el.classList;
|
||||
const classList = icon.$el.classList;
|
||||
const containsSizeClass = classList.contains('s99');
|
||||
const containsCustomClass = classList.contains('extraclasses');
|
||||
expect(containsSizeClass).toBe(true);
|
||||
|
|
Loading…
Reference in New Issue