{"record":{"id":"207ac77a58d0f1da","repo":"grafana/k6","slug":"filling-element-w","errorCode":null,"errorMessage":"filling element: %w","messagePattern":"filling element: %w","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"internal/js/modules/k6/browser/common/element_handle.go","lineNumber":916,"sourceCode":"\t\treturn fmt.Errorf(\"dispatching element event %q: %w\", typ, err)\n\t}\n\n\tapplySlowMo(h.ctx)\n\n\treturn nil\n}\n\n// Fill types the given value into the element.\nfunc (h *ElementHandle) Fill(value string, opts *ElementHandleBaseOptions) error {\n\tfill := func(apiCtx context.Context, handle *ElementHandle) (any, error) {\n\t\treturn nil, handle.fill(apiCtx, value)\n\t}\n\tfillAction := h.newAction(\n\t\t[]string{\"visible\", \"enabled\", \"editable\"},\n\t\tfill, opts.Force, withRetry, opts.NoWaitAfter, opts.Timeout,\n\t)\n\tif _, err := call(h.ctx, fillAction, opts.Timeout); err != nil {\n\t\treturn fmt.Errorf(\"filling element: %w\", err)\n\t}\n\n\tapplySlowMo(h.ctx)\n\n\treturn nil\n}\n\n// Focus scrolls element into view and focuses the element.\nfunc (h *ElementHandle) Focus() error {\n\tfocus := func(apiCtx context.Context, handle *ElementHandle) (any, error) {\n\t\treturn nil, handle.focus(apiCtx, false)\n\t}\n\topts := NewElementHandleBaseOptions(h.DefaultTimeout())\n\tfocusAction := h.newAction(\n\t\t[]string{}, focus, opts.Force, withRetry, opts.NoWaitAfter, opts.Timeout,\n\t)\n\tif _, err := call(h.ctx, focusAction, opts.Timeout); err != nil {\n\t\treturn fmt.Errorf(\"focusing on element: %w\", err)","sourceCodeStart":898,"sourceCodeEnd":934,"githubUrl":"https://github.com/grafana/k6/blob/3fcf5388d78cb382f0c0d42ec556a06bfd1b8dee/internal/js/modules/k6/browser/common/element_handle.go#L898-L934","documentation":"ElementHandle.fill() runs with 'visible', 'enabled' and 'editable' actionability preconditions, then an injected script focuses the node and sets its value. The wrapped error can be an actionability timeout, a DOM-level error returned by the injected script (e.g. 'Node is not editable'), or a stale/detached handle failure.","triggerScenarios":"The target is not a real input (div, span, or a component wrapper without an input inside); the input is readonly or disabled; the element is a contenteditable=false node; the actionability wait for visible/enabled/editable times out; the element was re-rendered between query and fill.","commonSituations":"Custom dropdown/autocomplete components that are not native inputs; form fields only enabled after async validation completes; readonly fields designed to be set via keyboard events; shadow-DOM components where the handle resolves to the host element instead of the inner input.","solutions":["Target the real input/textarea/contenteditable element inside the component instead of its wrapper","If the field is readonly by design, use el.type() or el.press() instead of fill()","Wait for editability first: await el.waitFor({ state: 'visible' }) and check await el.isEditable()","Increase the timeout: await el.fill('text', { timeout: '60s' })","Use { force: true } only to skip actionability waits - it will not bypass a genuine non-editable error"],"exampleFix":"// before\nconst el = await page.$('.my-combobox');\nawait el.fill('k6'); // wrapper div is not editable\n\n// after\nconst el = await page.$('.my-combobox input');\nif (!(await el.isEditable())) throw new Error('combobox input not editable yet');\nawait el.fill('k6');","handlingStrategy":"validation","validationCode":"// Validate the target is an editable field before filling\nconst editable = await el.isEditable(); // ignores timeouts by design\nif (!editable) {\n  throw new Error('target is not editable; select a real input/textarea');\n}\nawait el.fill('k6');","typeGuard":null,"tryCatchPattern":"try {\n  await el.fill('k6');\n} catch (e) {\n  const msg = String(e.message);\n  if (/not editable|readonly/i.test(msg)) {\n    await el.click();\n    await el.type('k6'); // fallback for readonly-by-design fields\n  } else if (/timed out/i.test(msg)) {\n    await el.fill('k6', { timeout: '60s' });\n  } else throw e;\n}","preventionTips":["Prefer selectors that point at the inner <input>/<textarea>, not component wrappers","Check isEditable() before fill when components toggle readonly dynamically","Use type()/press() for fields that must receive real keyboard input"],"tags":["browser","fill","form","editable","actionability","k6"],"backgroundTag":"element-not-editable","analyzedSha":"3fcf5388d78cb382f0c0d42ec556a06bfd1b8dee","analyzedAt":"2026-08-18T03:05:52.393Z","contentChangedAt":"2026-08-18T03:05:52.393Z","schemaVersion":2},"datasetVersion":"2026-09-23T08:17:48.524Z"}