{"record":{"id":"9e8a7e44e5f18e97","repo":"octobercms/october","slug":"command-option-is-not-set-for-toolbar-button","errorCode":null,"errorMessage":"command option is not set for toolbar button","messagePattern":"command option is not set for toolbar button","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"modules/backend/vuecomponents/document/assets/js/toolbar-button.js","lineNumber":131,"sourceCode":"                ev.preventDefault();\n                ev.stopPropagation();\n                return false;\n            }\n\n            if (this.settings.href) {\n                if (isHotkey) {\n                    window.open(this.settings.href, this.settings.target ? this.settings.target : '_self');\n                }\n\n                return;\n            }\n\n            ev.preventDefault();\n            ev.stopPropagation();\n\n            if (this.settings.type != 'dropdown' && !isMenuButton) {\n                if (!this.settings.command) {\n                    throw new Error('command option is not set for toolbar button');\n                }\n\n                this.$emit('command', this.settings.command, isHotkey, ev, this.$el, this.settings.customData);\n                return false;\n            }\n\n            if (this.settings.emitCommandBeforeMenu) {\n                this.$emit('command', this.settings.emitCommandBeforeMenu, isHotkey, ev, this.$el, this.settings.customData);\n            }\n\n            this.$refs.menu.showMenu(this.settings.type == 'dropdown' ? this.$refs.button : this.$refs.menuButton);\n            return false;\n        },\n\n        onMenuClosedWithEsc: function onMenuClosedWithEsc() {\n            var that = this;\n            Vue.nextTick(function () {\n                that.$refs.button.focus();","sourceCodeStart":113,"sourceCodeEnd":149,"githubUrl":"https://github.com/octobercms/october/blob/b608633a7e8922487d91a8161499020121c3b3bf/modules/backend/vuecomponents/document/assets/js/toolbar-button.js#L113-L149","documentation":"The backend document toolbar-button Vue component throws in its click handler when a plain (non-dropdown, non-menu) button has no `command` setting — the click would have nothing to emit. Only dropdown buttons, link buttons (settings.href), and menu buttons are allowed to omit `command`. Hotkey-triggered activation shares this code path, so keyboard shortcuts hit the same check.","triggerScenarios":"A toolbar button defined with the default type and no command is clicked, or its hotkey fires: settings = {title:'Save', type:'button'} without a `command` key reaches the $emit branch and throws.","commonSituations":"New toolbar buttons added to a backend document UI where the developer forgot the command; button settings built dynamically and the command key dropped by a conditional; renaming `command` during refactors.","solutions":["Add a command to the button settings: {title:'Save', type:'button', command:'save'}.","If the button should open a menu, set type:'dropdown' and provide items; if it navigates, set href (and optional target).","Make sure the parent component listens to @command to handle the emitted event."],"exampleFix":"// before\nthis.addToolbarButton({\n    title: 'Save',\n    type: 'button'\n});\n\n// after\nthis.addToolbarButton({\n    title: 'Save',\n    type: 'button',\n    command: 'save'\n});","handlingStrategy":"validation","validationCode":"function toolbarButtonIsActionable(settings) {\n    if (settings.type === 'dropdown' || (settings.items && settings.items.length)) return true;\n    if (settings.href) return true;\n    return typeof settings.command === 'string' && settings.command.length > 0;\n}\n\n// when building the toolbar\nif (!toolbarButtonIsActionable(button)) {\n    console.error('Toolbar button needs a command, href or menu:', button);\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Always set `command` on plain toolbar buttons","Handle the emitted @command event in the parent component","Use href for link buttons and type 'dropdown' with items for menu buttons"],"tags":["vue","toolbar","missing-option","frontend","document-ui"],"backgroundTag":"missing-required-option","analyzedSha":"b608633a7e8922487d91a8161499020121c3b3bf","analyzedAt":"2026-08-21T04:24:57.515Z","schemaVersion":2},"datasetVersion":"2026-08-21T11:28:35.574Z"}