Merge pull request #1121 from Safelite/bugfix/humphries/INSR-8561
INSR-8561: Fix default "enter" key behavior
This commit is contained in:
commit
71a130a855
3 changed files with 38 additions and 3 deletions
|
|
@ -21,9 +21,9 @@
|
||||||
'form-test-invalid': (disableForwardAction || isForwardActionDisabled),
|
'form-test-invalid': (disableForwardAction || isForwardActionDisabled),
|
||||||
'hide-button': isForwardButtonHidden
|
'hide-button': isForwardButtonHidden
|
||||||
}"
|
}"
|
||||||
:aria-disabled="disableForwardAction || isForwardActionDisabled"
|
:isDisabled="disableForwardAction || isForwardActionDisabled || isForwardButtonHidden"
|
||||||
:isDisabled="disableForwardAction || isForwardActionDisabled"
|
|
||||||
data-test-id="site-footer-main-button"
|
data-test-id="site-footer-main-button"
|
||||||
|
buttonType="submit"
|
||||||
@clickEvent="buttonClick" />
|
@clickEvent="buttonClick" />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
|
|
|
||||||
|
|
@ -192,4 +192,37 @@ describe('buttonMain.vue', () => {
|
||||||
// Expect
|
// Expect
|
||||||
expect(spy).not.toHaveBeenCalled();
|
expect(spy).not.toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('Button Types', () => {
|
||||||
|
it('Should set button type to submit', async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(
|
||||||
|
buttonMain,
|
||||||
|
setupMocks({
|
||||||
|
propsData: {
|
||||||
|
buttonType: 'submit'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
);
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
const button = wrapper.find('button');
|
||||||
|
|
||||||
|
// Expect
|
||||||
|
expect(button.attributes('type')).toEqual('submit');
|
||||||
|
});
|
||||||
|
it('Should default button type to button', async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(
|
||||||
|
buttonMain,
|
||||||
|
setupMocks()
|
||||||
|
);
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
const button = wrapper.find('button');
|
||||||
|
|
||||||
|
// Expect
|
||||||
|
expect(button.attributes('type')).toEqual('button');
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,7 @@
|
||||||
:aria-disabled="isDisabled"
|
:aria-disabled="isDisabled"
|
||||||
class="btn d-flex align-items-center justify-content-center delay"
|
class="btn d-flex align-items-center justify-content-center delay"
|
||||||
:class="[getVariant, `btn-${size}`, canOverride ? 'btn-override' : '']"
|
:class="[getVariant, `btn-${size}`, canOverride ? 'btn-override' : '']"
|
||||||
|
:type="buttonType"
|
||||||
@click="clicked">
|
@click="clicked">
|
||||||
<span class="m-0">{{ buttonText }}</span>
|
<span class="m-0">{{ buttonText }}</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
@ -21,7 +22,8 @@ export default {
|
||||||
isDisabled: Boolean,
|
isDisabled: Boolean,
|
||||||
isOutline: Boolean,
|
isOutline: Boolean,
|
||||||
pushToGA: Boolean,
|
pushToGA: Boolean,
|
||||||
canOverride: { type: Boolean, required: false, default: true }
|
canOverride: { type: Boolean, required: false, default: true },
|
||||||
|
buttonType: { type: String, required: false, default: 'button', validator: (val) => ['button', 'submit', 'reset'].includes(val) }
|
||||||
},
|
},
|
||||||
emits: ['click-event'],
|
emits: ['click-event'],
|
||||||
computed: {
|
computed: {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue