diff options
author | Kushal Pandya <kushal@gitlab.com> | 2018-08-07 18:00:08 +0530 |
---|---|---|
committer | Kushal Pandya <kushal@gitlab.com> | 2018-08-07 19:05:38 +0530 |
commit | f0c60bdccc8b794601cd821a412d972079235f22 (patch) | |
tree | 97dd98415b7157b2e0f41aa67b96ec385d26c030 | |
parent | f996f7e006b206ad6505dd1edd740fa142dbcb21 (diff) | |
download | gitlab-ce-f0c60bdccc8b794601cd821a412d972079235f22.tar.gz |
Add `tabindex` attribute support to show BS4 popover on trigger `focus`
-rw-r--r-- | app/assets/javascripts/vue_shared/components/icon.vue | 7 | ||||
-rw-r--r-- | spec/javascripts/vue_shared/components/icon_spec.js | 5 |
2 files changed, 12 insertions, 0 deletions
diff --git a/app/assets/javascripts/vue_shared/components/icon.vue b/app/assets/javascripts/vue_shared/components/icon.vue index e7ff76c8218..3cf90b45a97 100644 --- a/app/assets/javascripts/vue_shared/components/icon.vue +++ b/app/assets/javascripts/vue_shared/components/icon.vue @@ -75,6 +75,12 @@ export default { required: false, default: null, }, + + tabIndex: { + type: String, + required: false, + default: null, + }, }, computed: { @@ -98,6 +104,7 @@ export default { :height="height" :x="x" :y="y" + :tabindex="tabIndex" > <use v-bind="{ 'xlink:href':spriteHref }"/> </svg> diff --git a/spec/javascripts/vue_shared/components/icon_spec.js b/spec/javascripts/vue_shared/components/icon_spec.js index 882420e602e..01f4649339e 100644 --- a/spec/javascripts/vue_shared/components/icon_spec.js +++ b/spec/javascripts/vue_shared/components/icon_spec.js @@ -13,6 +13,7 @@ describe('Sprite Icon Component', function () { name: 'commit', size: 32, cssClasses: 'extraclasses', + tabIndex: '0', }); }); @@ -58,5 +59,9 @@ describe('Sprite Icon Component', function () { it('`name` validator should return false for existing icons', () => { expect(Icon.props.name.validator('commit')).toBe(true); }); + + it('should contain `tabindex` attribute on svg element when `tabIndex` prop is defined', () => { + expect(icon.$el.getAttribute('tabindex')).toBe('0'); + }); }); }); |