\n```\n\n... \n\n```\n\u003Cu-input\n v-model=\"params.row[key]\"\n required\n :form=\"`${params.index}-form`\"\n @select.stop\n @click.stop\n />\n```\n\n...\n\n```\n \u003Ctemplate #actions-data=\"params\">\n \u003Cu-button type=\"submit\" :form=\"`${params.index}-form`\">\n Submit\n \u003C/u-button>\n \u003C/template>\n```\n\nThe issue now is that I also use some SelectMenu items in some of my columns, and by inspecting the code I can clearly see that it wraps an input inside it, but I'm not able to pass the form attribute as a props.\n\nTo be more clear, currently here's a bit of the code inside the SelectMenu.vue component : \n\n```\n \u003Cinput\n v-if=\"required\"\n :value=\"modelValue\"\n :required=\"required\"\n :class=\"uiMenu.required\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n >\n```\n\nI'd like this to be like so, to be able to clearly state the value on the input's form HTML attribute : \n\n```\n \u003Cinput\n v-if=\"required\"\n :value=\"modelValue\"\n :required=\"required\"\n :class=\"uiMenu.required\"\n :form=\"formAttribute\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n >\n```\n\nI'm gonna try it locally and open a PR for that. \n\n### Additional context\n\n_No response_",[2024],{"name":1985,"color":1986},3106,"closed","[SelectMenu] Add prop to manage the input's form HTML attribute","2025-03-08T12:22:25Z","https://github.com/nuxt/ui/issues/3106",0.69883436,{"description":2032,"labels":2033,"number":2041,"owner":1991,"repository":1992,"state":2026,"title":2042,"updated_at":2043,"url":2044,"score":2045},"### For what version of Nuxt UI are you asking this question?\n\nv3.0.0-alpha.x\n\n### Description\n\nFor example if I use something like this,\n\n`const items=[{label:'option 1', value:1},{label:'option 2',value:2}]`\n\n the value that is always assigned is string '1'\n\n`const typeData=ref(1)`\n\n ``\n \u003CUSelect v-model=\"form.productType\" class=\"w-full\" :items=\"items\" />\n```\n",[2034,2037,2040],{"name":2035,"color":2036},"duplicate","cfd3d7",{"name":2038,"color":2039},"question","d876e3",{"name":1988,"color":1989},2924,"[v3] select type only string?","2024-12-17T15:56:57Z","https://github.com/nuxt/ui/issues/2924",0.7379326,{"description":2047,"labels":2048,"number":2055,"owner":1991,"repository":1991,"state":2026,"title":2056,"updated_at":2057,"url":2058,"score":2059},"### Environment\r\n\r\n \"nuxt\": \"^3.0.0\",\r\n\r\n\r\n### Reproduction\r\n\r\nI created a composable as follows to attach a header whenever I use the useFetch function.\r\n\r\n```\r\nexport const useCommon = () => {\r\n async function useFetchToken(api: string, option: useFetchTokenTyle){\r\n const autoOption:any = {\r\n headers: (option.headers) ?? { Authorization: 'Bearer ' + ado_token.value }\r\n }\r\n ...\r\n return await useFetch(api, {...option,...autoOption}) \r\n }\r\n return {\r\n useFetchToken\r\n }\r\n}\r\n```\r\nand I use this useFetchToken composable twice in one\r\n\r\n```\r\n\u003Cscript setup lang=\"ts\">\r\nconst { useFetchToken } = useCommon()\r\nlet {data:category_lists, refresh:cateRefresh} = await useFetchToken('/api/action', { \r\n baseURL: CATEGORY_API,\r\n method: 'post',\r\n body: {\r\n action: 'DoSomeThing',\r\n }\r\n})\r\n\r\nlet {data:section_lists, refresh:sectionRefresh} = await useFetchToken('/api/action', { \r\n baseURL: CATEGORY_API,\r\n method: 'post',\r\n body: {\r\n action: 'DoSomeThing2',\r\n }\r\n})\r\n```\r\nThen, a strange result occurs.\r\n\r\n\"category_lists\" affect from second useFetchToken composable. \"category_lists\" is overwritten by 2nd useFetchToken composable.\r\n\r\n\r\n\r\n\r\n\r\n### Describe the bug\r\n\r\nThe 2 fetchs are return different results.\r\n\r\nBut when I refresh, category_lists is equals to section_lists.\r\n\r\nWhen I run cateRefresh, category_lists get right result.\r\nWhen I delete 2nd useFetchToken part, \"category_lists\" work correctly.\r\nWhen I change useFetchToken to useFetch, it will work well all.\r\n",[2049,2052],{"name":2050,"color":2051},"3.x","29bc7f",{"name":2053,"color":2054},"pending triage","E99695",12440,"When I use the method from composable twice, it works weird","2023-01-19T16:06:25Z","https://github.com/nuxt/nuxt/issues/12440",0.774953,{"description":2061,"labels":2062,"number":2065,"owner":1991,"repository":2066,"state":2026,"title":2067,"updated_at":2068,"url":2069,"score":2070},"Shortcut for the \"Save\" button.",[2063],{"name":1985,"color":2064},"1ad6ff",657,"nuxt.com","[Project] Support `CMD+S` to commit","2023-02-15T12:32:41Z","https://github.com/nuxt/nuxt.com/issues/657",0.77928036,{"description":2072,"labels":2073,"number":2077,"owner":1991,"repository":2078,"state":2026,"title":2079,"updated_at":2080,"url":2081,"score":2082},"### 🐛 The bug\n\nOn **google-tag-manager** page the content isn't rendered but is present in (main) code.\n\n- https://scripts.nuxt.com/scripts/tracking/google-tag-manager\n- https://github.com/nuxt/scripts/blob/main/docs/content/scripts/tracking/google-tag-manager.md\n\n### 🛠️ To reproduce\n\nhttps://scripts.nuxt.com/scripts/tracking/google-tag-manager\n\n### 🌈 Expected behavior\n\nDisplay text content.\n\n### ℹ️ Additional context\n\n_No response_",[2074],{"name":2075,"color":2076},"documentation","0075ca",430,"scripts","Website: Callout component not displaying content","2025-03-13T05:07:49Z","https://github.com/nuxt/scripts/issues/430",0.7799768,{"description":2084,"labels":2085,"number":2088,"owner":1991,"repository":1991,"state":2026,"title":2089,"updated_at":2090,"url":2091,"score":2092},"### Describe the feature\n\n## The problem\r\n\r\nUses that need to use interceptors or anything else on `useFetch()` require to:\r\n\r\na. Create a new composable `useCustomFetch()` with the new functionality.\r\nb. Create a new compasable with `$fetch` and add the new functionality with the old.\r\nc. Modify the `useFetch()` on each call in every part of the application.\r\n\r\nAll of these scenarios could be fixed by offering the user a way to modify the `useFetch()` function _before_ its given into userland. \r\n\r\n## Solution\r\n\r\nThis could be accomplished easily by allowing the user to _replace_ the `useFetch()` composable with it' own and receive the original object. Each callback registered would be executed without order guarantee.\r\n\r\n```js\r\n// /composables/useFetch.js\r\n\r\nexport default () => {\r\n return useFetch().global(fetch => {\r\n // ...\r\n })\r\n}\r\n```\r\n\r\nThis approach fixes four things:\r\n\r\n- Doesn't replaces `useFetch()`, it extends it.\r\n- Users that already use `useFetch.js` can still use it as always.\r\n- Users that already use `useCustomFetch.js` can still use it as always.\r\n- Remove the `WARN Duplicated imports \"useFetch\", the one from \"#app\" has been ignored`\n\n### Additional information\n\n- [ ] Would you be willing to help implement this feature?\n- [ ] Could this feature be implemented as a module?\n\n### Final checks\n\n- [X] Read the [contribution guide](https://nuxt.com/docs/community/contribution).\n- [X] Check existing [discussions](https://github.com/nuxt/nuxt/discussions) and [issues](https://github.com/nuxt/nuxt/issues).",[2086,2087],{"name":2050,"color":2051},{"name":2053,"color":2054},22778,"Allow to modify global useFetch","2023-08-24T08:25:40Z","https://github.com/nuxt/nuxt/issues/22778",0.78401494,{"description":2094,"labels":2095,"number":2105,"owner":1991,"repository":2106,"state":2026,"title":2107,"updated_at":2108,"url":2109,"score":2110},"I'm setting up the nuxt-vitest module in my project. Though I'm running into some issues getting a simple test, I use mountSuspended(Logo) to test the mounting of a Logo component. This component uses i18n. Whereas when I'm using mount from Vitest the test passes.\r\n\r\nThe error I'm getting is as follows:\r\n```\r\nVitest caught 1 unhandled error during the test run.\r\nThis might cause false positive tests. Resolve unhandled errors to make sure your tests are not affected.\r\n\r\n⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Unhandled Rejection ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯\r\nSyntaxError: Need to install with `app.use` function\r\n ❯ Module.createCompileError ../node_modules/.pnpm/@intlify+message-compiler@9.3.0-beta.17/node_modules/@intlify/message-compiler/dist/message-compiler.mjs:54:19\r\n ❯ createI18nError ../node_modules/.pnpm/vue-i18n@9.3.0-beta.17_vue@3.3.4/node_modules/vue-i18n/dist/vue-i18n.runtime.mjs:97:34\r\n 96| [I18nErrorCodes.INVALID_ARGUMENT]: 'Invalid argument',\r\n 97| [I18nErrorCodes.MUST_BE_CALL_SETUP_TOP]: 'Must be called at the top of a `setup` function',\r\n 98| [I18nErrorCodes.NOT_INSLALLED]: 'Need to install with `app.use` function',\r\n | ^\r\n 99| [I18nErrorCodes.UNEXPECTED_ERROR]: 'Unexpected error',\r\n 100| [I18nErrorCodes.NOT_AVAILABLE_IN_LEGACY_MODE]: 'Not available in legacy mode',\r\n ❯ Module.useI18n ../node_modules/.pnpm/vue-i18n@9.3.0-beta.17_vue@3.3.4/node_modules/vue-i18n/dist/vue-i18n.runtime.mjs:2253:15\r\n ❯ setup app.vue:33:40\r\n```\r\n\r\nAnd while we are at it. Is there a way to test with the translated i18n messages iso the keys?\r\n\r\n######\r\n\r\nHere are some snippets from my configuration.\r\nvitest.config.js\r\n```\r\n...\r\nexport default defineVitestConfig({\r\n resolve: {\r\n alias\r\n },\r\n test: {\r\n dir: tests,\r\n setupFiles: ['tests/unit.setup.ts'],\r\n environment: 'jsdom',\r\n globals: true,\r\n root: rootDir,\r\n environmentOptions: {\r\n nuxt: {\r\n rootDir\r\n }\r\n }\r\n }\r\n})\r\n```\r\n\r\n./test/nuxt/components/Logo.nuxt.spec.ts (with mountSuspended)\r\n```\r\nimport { describe, it, expect } from 'vitest'\r\n\r\nimport { mountSuspended } from 'vitest-environment-nuxt/utils'\r\nimport Logo from '@/components/header/Logo.vue'\r\n\r\ndescribe('HeaderLogo', () => {\r\n it('can mount some component', async () => {\r\n const component = await mountSuspended(Logo)\r\n expect(component.vm).toBeTruthy()\r\n expect(component.text()).toMatchInlineSnapshot(\r\n '\"global.logo-brand-name.global.logo-brand-localehomepage.logo-tagline\"'\r\n )\r\n })\r\n})\r\n```\r\n./tests/unit.setup.ts\r\n```\r\nimport { config } from '@vue/test-utils'\r\nimport { createI18n } from 'vue-i18n'\r\n\r\nimport nlNL from '~/locales/nl_NL.json'\r\n\r\nconst i18n = createI18n({\r\n legacy: false,\r\n locale: 'nl_NL',\r\n missing: (_, key) => key,\r\n messages: {\r\n nlNL\r\n }\r\n})\r\n\r\nconfig.global.mocks = {\r\n t: msg => msg\r\n}\r\nconfig.global.plugins.push(i18n)\r\n```\r\n\r\n\r\n./tests/nuxt/components/Logo.nuxt.spec.ts (without mountSuspended)\r\n```\r\nimport { mount } from '@vue/test-utils'\r\nimport { describe, it, expect } from 'vitest'\r\n\r\nimport Logo from '@/components/header/Logo.vue'\r\n\r\ndescribe('HeaderLogo', () => {\r\n it('can mount some component', () => {\r\n const component = mount(Logo)\r\n expect(component.vm).toBeTruthy()\r\n expect(component.text()).toMatchInlineSnapshot(\r\n '\"global.logo-brand-name.global.logo-brand-localehomepage.logo-tagline\"'\r\n )\r\n })\r\n})\r\n```\r\n\r\n",[2096,2099,2102],{"name":2097,"color":2098},"vitest-environment","b60205",{"name":2100,"color":2101},"needs reproduction","DE7793",{"name":2103,"color":2104},"closed-by-bot","ededed",585,"test-utils","mountSuspended with i18n","2025-01-22T12:49:12Z","https://github.com/nuxt/test-utils/issues/585",0.788132,["Reactive",2112],{},["Set"],["ShallowReactive",2115],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"DW82PyloOEwGVBqOstI0Ha35iNL_E4nlgp9LAVGLbX4":-1},"/nuxt/ui/3647"]