{"record":{"id":"d42281b403ce24c2","repo":"octobercms/october","slug":"command-option-is-not-set-for-menu-item","errorCode":null,"errorMessage":"command option is not set for menu item","messagePattern":"command option is not set for menu item","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"modules/backend/vuecomponents/dropdownmenu/assets/js/menuitem.js","lineNumber":97,"sourceCode":"                ev.preventDefault();\n                ev.stopPropagation();\n                return false;\n            }\n\n            if (this.hasSubmenu) {\n                this.showSubmenu();\n                ev.preventDefault();\n                ev.stopPropagation();\n                return false;\n            }\n\n            if (this.href) {\n                this.$emit('closemenu');\n                return;\n            }\n\n            if (!this.command) {\n                throw new Error('command option is not set for menu item');\n            }\n\n            ev.preventDefault();\n            ev.stopPropagation();\n\n            this.$emit('command', this.command);\n            return false;\n        },\n\n        onMouseEnter: function onMouseEnter() {\n            this.$emit('itemmouseenter', this.componentUid);\n            this.showSubmenu();\n\n            if (!this.disabled && this.$refs.itemElement) {\n                var that = this;\n                Vue.nextTick(function () {\n                    that.$refs.itemElement.focus();\n                });","sourceCodeStart":79,"sourceCodeEnd":115,"githubUrl":"https://github.com/octobercms/october/blob/b608633a7e8922487d91a8161499020121c3b3bf/modules/backend/vuecomponents/dropdownmenu/assets/js/menuitem.js#L79-L115","documentation":"The dropdown-menu item Vue component throws in its click handler when an item has no `command` and no href or submenu to fall back on — the click would have nothing to emit. It is the JavaScript mirror of the PHP ItemDefinition constructor rule and fires at interaction time when items were supplied as plain objects that bypassed server-side construction.","triggerScenarios":"Passing a plain items array to the dropdown menu component containing {label:'Do it'} without command, then clicking it; a computed property that drops the command key; an item intended as a link that also lacks href.","commonSituations":"Menus assembled client-side instead of via the PHP ItemDefinition pipeline; dynamic items from an API response missing the command field; refactors renaming command to action.","solutions":["Add a command to every clickable item: {label:'Do it', command:'do:it'}.","Use href for navigation items or items:[...] for submenus — those paths do not require command.","Map/sanitize API-driven item lists to guarantee the command key exists before rendering."],"exampleFix":"// before\nitems: [\n    { label: 'Duplicate' }\n]\n\n// after\nitems: [\n    { label: 'Duplicate', command: 'duplicate' }\n]","handlingStrategy":"validation","validationCode":"function menuItemsAreActionable(items) {\n    return items.every(function (item) {\n        return Boolean(item.command || item.href || (item.items && item.items.length));\n    });\n}\n\nif (!menuItemsAreActionable(this.items)) {\n    console.error('Dropdown menu contains items without command/href/submenu');\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Map API data to {label, command} pairs explicitly","Use href for navigation items","Build menus through the PHP ItemDefinition pipeline so bad items fail server-side with a stack trace"],"tags":["vue","dropdown-menu","missing-option","frontend"],"backgroundTag":"missing-required-option","analyzedSha":"b608633a7e8922487d91a8161499020121c3b3bf","analyzedAt":"2026-08-21T04:24:57.515Z","schemaVersion":2},"datasetVersion":"2026-08-21T11:28:35.574Z"}