diff --git a/__tests__/autosuggest.test.js b/__tests__/autosuggest.test.js index 95407f9..10f3ce8 100644 --- a/__tests__/autosuggest.test.js +++ b/__tests__/autosuggest.test.js @@ -679,4 +679,28 @@ describe("Autosuggest", () => { expect(str).toMatchSnapshot(); }); }); + + it("can modify input props", async () => { + const Parent = { + template: `
+ +
+ `, + components: { Autosuggest }, + data: () => { + return { + 'ph': 'Type here...' + } + } + } + + const wrapper = mount(Parent); + const input = wrapper.find('input[type="text"]') + expect(input.attributes("placeholder")).toBe('Type here...'); + + wrapper.setData({ ph: 'Please type here...' }) + expect(input.attributes("placeholder")).toBe('Please type here...') + }); }); diff --git a/src/Autosuggest.vue b/src/Autosuggest.vue index 20fbfeb..650e161 100644 --- a/src/Autosuggest.vue +++ b/src/Autosuggest.vue @@ -186,7 +186,6 @@ export default { currentItem: null, loading: false /** Helps with making sure the dropdown doesn't stay open after certain actions */, didSelectFromOptions: false, - internal_inputProps: {}, // Nest default prop values don't work currently in Vue defaultInputProps: { type: 'text', autocomplete: "off", @@ -195,6 +194,12 @@ export default { }; }, computed: { + internal_inputProps() { + return { + ...this.defaultInputProps, + ...this.inputProps + } + }, listeners() { return { ...this.$listeners, @@ -292,7 +297,6 @@ export default { } }, created() { - this.internal_inputProps = { ...this.defaultInputProps, ...this.inputProps }; this.loading = true; }, mounted() {