@object-ui/fields 17.2.0 → 17.5.0

package/src/widgets/optionWidgets.gatedOptions.test.tsx

@@ -0,0 +1,267 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * A GATED option list never deletes the stored value (objectui#4247).
+ *
+ * The four fixed-option widgets end their cascade resolution with a "drop what
+ * is no longer offered" effect (ADR-0058 / #2715). `resolveCascadingOptions`
+ * returns an EMPTY offered set whenever the list is gated — a declared
+ * `dependsOn` parent is still empty — so on mount the effect found nothing
+ * "still offered" and wrote the field empty, while the widget was rendering
+ * `OptionsEmptyState` ("select Country first") right next to it: the control
+ * tells the user it cannot offer anything, and deletes what they had.
+ *
+ * Ruling (#4247): **gated means UNKNOWN, not invalid.** The cascade clear exists
+ * so a USER-DRIVEN parent change prunes a now-invalid child; a gated set on
+ * MOUNT is missing information — the record simply arrived with the parent
+ * empty (a later-cleared parent, an import, a partially-migrated row) — and
+ * destroying stored data on missing information is silent data loss. Convergence
+ * stays where it belongs: once the parent IS chosen and the resolved set
+ * genuinely excludes the stored value, the existing prune applies.
+ *
+ * Three states, kept apart here so a future edit cannot collapse them:
+ *
+ *  1. never-configured — no authored `options` at all. Guarded since #4220;
+ *     control only, pinned in `optionWidgets.unconfiguredOptions.test.tsx`.
+ *  2. gated — an authored list withheld behind an unmet `dependsOn`. NEW: the
+ *     value survives.
+ *  3. resolved-and-excludes — the parent IS chosen and the resolved set does not
+ *     offer the stored value. Clears; that is the ADR-0058 contract.
+ *
+ * The gate is read from the resolver's own `gated` flag, never re-derived from
+ * `options.length === 0` — that would collide with state 1, which is a
+ * different case with a different guard.
+ */
+
+import { describe, it, expect, vi } from 'vitest';
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { SelectField } from './SelectField';
+import { MultiSelectField } from './MultiSelectField';
+import { CheckboxesField } from './CheckboxesField';
+import { RadioField } from './RadioField';
+
+/** Options that exist for exactly one country — the cascade the gate withholds. */
+const PROVINCE_OPTIONS = [
+  { label: 'Zhejiang', value: 'zj', visibleWhen: "record.country == 'cn'" },
+  { label: 'California', value: 'ca', visibleWhen: "record.country == 'us'" },
+];
+
+const provinceField = (type: string) =>
+  ({ name: 'province', type, dependsOn: 'country', options: PROVINCE_OPTIONS }) as any;
+
+describe('option widgets — a GATED list never deletes the stored value (#4247)', () => {
+  it('MultiSelectField keeps its array and shows the parent-first hint', () => {
+    const onChange = vi.fn();
+    render(
+      <MultiSelectField
+        value={['zj']}
+        onChange={onChange}
+        field={provinceField('multiselect')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    expect(screen.getByTestId('multiselect-empty-province')).toHaveTextContent(
+      /select country first/i,
+    );
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('CheckboxesField keeps its array and shows the parent-first hint', () => {
+    const onChange = vi.fn();
+    render(
+      <CheckboxesField
+        value={['zj']}
+        onChange={onChange}
+        field={provinceField('checkboxes')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    expect(screen.getByTestId('checkboxes-empty-province')).toHaveTextContent(
+      /select country first/i,
+    );
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('RadioField keeps its value and shows the parent-first hint', () => {
+    const onChange = vi.fn();
+    render(
+      <RadioField
+        value="zj"
+        onChange={onChange}
+        field={provinceField('radio')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    expect(screen.getByTestId('radio-empty-province')).toHaveTextContent(/select country first/i);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('SelectField keeps its value and shows the parent-first hint', () => {
+    const onChange = vi.fn();
+    render(
+      <SelectField
+        value="zj"
+        onChange={onChange}
+        field={provinceField('select')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    expect(screen.getByTestId('select-empty-province')).toHaveTextContent(/select country first/i);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+});
+
+describe('controls — a RESOLVED list still prunes what it does not offer (ADR-0058)', () => {
+  it('MultiSelectField drops the element the chosen parent excludes', () => {
+    const onChange = vi.fn();
+    render(
+      <MultiSelectField
+        value={['zj', 'ca']}
+        onChange={onChange}
+        field={provinceField('multiselect')}
+        {...({ name: 'province', dependentValues: { country: 'cn' } } as any)}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(['zj']);
+  });
+
+  it('CheckboxesField drops the element the chosen parent excludes', () => {
+    const onChange = vi.fn();
+    render(
+      <CheckboxesField
+        value={['zj', 'ca']}
+        onChange={onChange}
+        field={provinceField('checkboxes')}
+        {...({ name: 'province', dependentValues: { country: 'cn' } } as any)}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(['zj']);
+  });
+
+  it('RadioField clears a value the chosen parent excludes', () => {
+    const onChange = vi.fn();
+    render(
+      <RadioField
+        value="ca"
+        onChange={onChange}
+        field={provinceField('radio')}
+        {...({ name: 'province', dependentValues: { country: 'cn' } } as any)}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(undefined);
+  });
+
+  it('SelectField clears a value the chosen parent excludes', () => {
+    const onChange = vi.fn();
+    render(
+      <SelectField
+        value="ca"
+        onChange={onChange}
+        field={provinceField('select')}
+        {...({ name: 'province', dependentValues: { country: 'cn' } } as any)}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(undefined);
+  });
+});
+
+describe('transition — a gated field converges the moment its parent is chosen (#4247)', () => {
+  it('MultiSelectField: gated keeps, then prunes once the resolved set excludes', () => {
+    const onChange = vi.fn();
+    const { rerender } = render(
+      <MultiSelectField
+        value={['zj']}
+        onChange={onChange}
+        field={provinceField('multiselect')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    // Gated: the value survives, nothing is staged.
+    expect(onChange).not.toHaveBeenCalled();
+
+    // The user picks the parent — the set resolves and genuinely excludes 'zj'.
+    rerender(
+      <MultiSelectField
+        value={['zj']}
+        onChange={onChange}
+        field={provinceField('multiselect')}
+        {...({ name: 'province', dependentValues: { country: 'us' } } as any)}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith([]);
+  });
+
+  it('MultiSelectField: a resolved set that INCLUDES the stored value keeps it', () => {
+    const onChange = vi.fn();
+    const { rerender } = render(
+      <MultiSelectField
+        value={['zj']}
+        onChange={onChange}
+        field={provinceField('multiselect')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    rerender(
+      <MultiSelectField
+        value={['zj']}
+        onChange={onChange}
+        field={provinceField('multiselect')}
+        {...({ name: 'province', dependentValues: { country: 'cn' } } as any)}
+      />,
+    );
+    expect(onChange).not.toHaveBeenCalled();
+    expect(screen.getByTestId('multiselect-option-zj')).toBeInTheDocument();
+  });
+
+  it('SelectField: gated keeps, then clears once the resolved set excludes', () => {
+    const onChange = vi.fn();
+    const { rerender } = render(
+      <SelectField
+        value="zj"
+        onChange={onChange}
+        field={provinceField('select')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    expect(onChange).not.toHaveBeenCalled();
+
+    rerender(
+      <SelectField
+        value="zj"
+        onChange={onChange}
+        field={provinceField('select')}
+        {...({ name: 'province', dependentValues: { country: 'us' } } as any)}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(undefined);
+  });
+
+  it('SelectField: a resolved set that INCLUDES the stored value keeps it', () => {
+    const onChange = vi.fn();
+    const { rerender } = render(
+      <SelectField
+        value="zj"
+        onChange={onChange}
+        field={provinceField('select')}
+        {...({ name: 'province', dependentValues: {} } as any)}
+      />,
+    );
+    rerender(
+      <SelectField
+        value="zj"
+        onChange={onChange}
+        field={provinceField('select')}
+        {...({ name: 'province', dependentValues: { country: 'cn' } } as any)}
+      />,
+    );
+    expect(onChange).not.toHaveBeenCalled();
+  });
+});

package/src/widgets/optionWidgets.unconfiguredOptions.test.tsx

@@ -0,0 +1,150 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * An option widget with NO authored `options` keeps the value it was given
+ * (objectui#4220).
+ *
+ * The four fixed-option widgets each end their cascade resolution with a
+ * "clear what is no longer offered" effect (ADR-0058 / #2715). It ran against
+ * the RESOLVED set without asking why that set was empty, and the two causes
+ * are opposites:
+ *
+ *  - the list cascaded down to zero — a real decision, and clearing is the
+ *    documented behaviour;
+ *  - the field declares no `options` at all — no decision was made anywhere,
+ *    and the widget's own next branch renders `OptionsEmptyState`, i.e. it
+ *    tells the user there is nothing to pick. Clearing here deletes the stored
+ *    value of a field the user was shown nothing but a hint for, on MOUNT,
+ *    without a single interaction.
+ *
+ * Measured on two live hosts, both of which mount these widgets outside a form:
+ * the grid's inline cell editor (`FieldEditWidget`, since #2942) and — since
+ * #4220 — the detail page's inline editor, which stages every `onChange` into
+ * the record draft the moment a section enters edit mode. An options-less
+ * `checkboxes` there wiped its array as soon as the user started editing any
+ * OTHER field in the same section, and the save bar wrote the empty array back.
+ *
+ * The prune now requires an authored list to prune against. The cascade itself
+ * is untouched — the controls below still clear a value the configured list no
+ * longer offers.
+ */
+
+import { describe, it, expect, vi } from 'vitest';
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { SelectField } from './SelectField';
+import { MultiSelectField } from './MultiSelectField';
+import { CheckboxesField } from './CheckboxesField';
+import { RadioField } from './RadioField';
+
+const OPTIONS = [{ label: 'Alpha', value: 'alpha' }];
+
+describe('option widgets — an unconfigured list never deletes the stored value (#4220)', () => {
+  it('MultiSelectField keeps its array and shows the unfillable state', () => {
+    const onChange = vi.fn();
+    render(
+      <MultiSelectField
+        value={['alpha', 'beta']}
+        onChange={onChange}
+        field={{ name: 'topics', type: 'multiselect' } as any}
+      />,
+    );
+    expect(screen.getByTestId('multiselect-empty-topics')).toBeInTheDocument();
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('CheckboxesField keeps its array and shows the unfillable state', () => {
+    const onChange = vi.fn();
+    render(
+      <CheckboxesField
+        value={['alpha', 'beta']}
+        onChange={onChange}
+        field={{ name: 'perks', type: 'checkboxes' } as any}
+      />,
+    );
+    expect(screen.getByTestId('checkboxes-empty-perks')).toBeInTheDocument();
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('RadioField keeps its value and shows the unfillable state', () => {
+    const onChange = vi.fn();
+    render(
+      <RadioField
+        value="alpha"
+        onChange={onChange}
+        field={{ name: 'tier', type: 'radio' } as any}
+      />,
+    );
+    expect(screen.getByTestId('radio-empty-tier')).toBeInTheDocument();
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('SelectField keeps its value and shows the unfillable state', () => {
+    const onChange = vi.fn();
+    render(
+      <SelectField
+        value="alpha"
+        onChange={onChange}
+        field={{ name: 'stage', type: 'select' } as any}
+      />,
+    );
+    expect(screen.getByTestId('select-empty-stage')).toBeInTheDocument();
+    expect(onChange).not.toHaveBeenCalled();
+  });
+});
+
+describe('controls — a CONFIGURED list still cascade-clears what it no longer offers', () => {
+  it('MultiSelectField drops the unoffered element, keeps the offered one', () => {
+    const onChange = vi.fn();
+    render(
+      <MultiSelectField
+        value={['alpha', 'zeta']}
+        onChange={onChange}
+        field={{ name: 'topics', type: 'multiselect', options: OPTIONS } as any}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(['alpha']);
+  });
+
+  it('CheckboxesField drops the unoffered element, keeps the offered one', () => {
+    const onChange = vi.fn();
+    render(
+      <CheckboxesField
+        value={['alpha', 'zeta']}
+        onChange={onChange}
+        field={{ name: 'perks', type: 'checkboxes', options: OPTIONS } as any}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(['alpha']);
+  });
+
+  it('RadioField clears a value the configured list does not offer', () => {
+    const onChange = vi.fn();
+    render(
+      <RadioField
+        value="zeta"
+        onChange={onChange}
+        field={{ name: 'tier', type: 'radio', options: OPTIONS } as any}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(undefined);
+  });
+
+  it('SelectField clears a value the configured list does not offer', () => {
+    const onChange = vi.fn();
+    render(
+      <SelectField
+        value="zeta"
+        onChange={onChange}
+        field={{ name: 'stage', type: 'select', options: OPTIONS } as any}
+      />,
+    );
+    expect(onChange).toHaveBeenCalledWith(undefined);
+  });
+});

package/src/widgets/toDomProps.ts

@@ -0,0 +1,204 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {
+  pickDomProps,
+  type SduiDomPassThroughKey,
+  type DomProps as CoreDomProps,
+} from '@object-ui/core';
+import type { FieldWidgetComponentProps, FieldWidgetDomProps } from './types';
+
+/**
+ * The RUNTIME EXECUTOR of the "DOM pass-through" section of
+ * {@link FieldWidgetComponentProps} (objectui#3291).
+ *
+ * ## The defect
+ *
+ * Field widgets forwarded their leftover props to a control with a bare
+ * spread — `const { inputType, ...domProps } = props as any; <Input
+ * {...domProps} />`. Whatever a host handed the widget therefore became a DOM
+ * attribute. Measured on `origin/main`, a real form + a real widget:
+ *
+ * ```
+ * <input placeholder="PH-f" zzcanary="CANARY-STR" zzcanaryobj="[object Object]"
+ *        zzcanarynum="42" id="…" type="text" value="" name="f">
+ * ```
+ *
+ * The `[object Object]` this issue is named for is an authored field-config
+ * key being `String()`-ed onto an attribute. React 19 does not warn: an
+ * all-lowercase unknown attribute is passed through in complete silence, which
+ * is why this survived so long.
+ *
+ * ## Why a whitelist, and not a list of keys to drop
+ *
+ * The biggest leak source is not any NAMED renderer prop — it is the open tail
+ * of author-supplied keys. The form renderer destructures a fixed set of known
+ * keys and forwards `...fieldProps` verbatim
+ * (`components/src/renderers/form/form.tsx`), and `SchemaRenderer` is wider
+ * still: it spreads the whole authored node as props and has no strip layer at
+ * all, so on the SDUI path a widget's own spread is the ONLY line of defence.
+ *
+ * A blacklist enumerating today's renderer-only keys (`error`, `emptyHint`,
+ * `dataSource`, `dependentValues`, `dependsOn`, `options`, `inputType`, …)
+ * would pass every one of the canaries above and would not stop the next
+ * authored key either. Only "keep the known-safe set, drop the rest" closes
+ * it, which is what this function does.
+ *
+ * ## Declared = enforced
+ *
+ * {@link FieldWidgetComponentProps} already DECLARES the closed set of keys a
+ * widget may receive, and {@link FieldWidgetDomProps} names the subset that may
+ * legitimately reach a DOM element (objectui#3221). Until now that was a
+ * type-level claim a widget could violate at runtime simply by spreading. This
+ * function is that declaration's executable form, and TWO compile-time
+ * assertions below bind them in both directions — forwarding an undeclared key
+ * and declaring an unforwarded DOM key are each a compile error. Neither
+ * direction can drift silently.
+ *
+ * ## Deliberately NOT forwarded
+ *
+ * `role` and other HTML global attributes are absent because the contract does
+ * not declare them. They reached the DOM before this change only through the
+ * open spread. If a field node should be able to author one, DECLARE it on
+ * `FieldWidgetComponentProps` first and add it here — do not reopen the spread
+ * (AGENTS.md #0.1: fix the contract, never widen the consumer).
+ *
+ * ## Where the mechanism lives now, and why the key list stayed here
+ *
+ * objectui#4425 phase 2 promoted this whitelist to the SDUI widget contract
+ * generally, so the MECHANISM — filter by a declared key list plus the `aria-*`
+ * / `data-*` open families — moved to `@object-ui/core`
+ * (`utils/dom-props.ts`, `pickDomProps`), where every plugin package can reach
+ * it without depending on `@object-ui/fields` (the objectui#4409
+ * dependency-direction method: `plugin-chatbot` declares `@object-ui/core` and
+ * does not declare this package).
+ *
+ * The KEY LIST did not move, because it is not the same list. Measured on
+ * objectui#4431:
+ *
+ *  - `name` and `disabled` are here and NOT in the SDUI set: both are legal
+ *    only on form controls, which is what every widget in this package renders
+ *    and what `FieldWidgetComponentProps` declares. `name` on the `<div>` an
+ *    SDUI container widget renders is a leak — one of the 14 attributes #4431
+ *    closed — and two widgets here already hand-strip it when they spread onto
+ *    something that is not a control (`ObjectRefField`'s trigger,
+ *    `FileField`'s dropzone).
+ *  - `role` is in the SDUI set and NOT here: `SchemaRenderer` resolves it for
+ *    every node from `@objectstack/spec`'s `AriaPropsSchema`, while this
+ *    contract deliberately does not declare it (see "Deliberately NOT
+ *    forwarded" above).
+ *
+ * So: one mechanism, two declarations, each bound by the assertions below to
+ * the contract it executes. Not two judges.
+ */
+const DOM_PASS_THROUGH_KEYS = [
+  /* ── The contract's own "DOM pass-through" block, verbatim ─────────────── */
+  'id',
+  'name',
+  'autoFocus',
+  'tabIndex',
+  'onBlur',
+  'onFocus',
+  'onClick',
+
+  /* ── Two more declared keys that ARE valid DOM attributes ──────────────── */
+  //
+  // Both are declared on `FieldWidgetComponentProps` under the
+  // controlled-input contract rather than the DOM block, because widgets also
+  // INTERPRET them (`className` gets composed with the widget's own classes;
+  // `disabled` is OR-ed with `readonly`). They are still `class` and
+  // `disabled` on the element, and every widget here already forwards them.
+  //
+  // Withholding them would make this helper a silent styling- and
+  // interactivity-dropper: `<Input {...toDomProps(props)} />` — the shape this
+  // change teaches every future widget author to write — would quietly lose
+  // the host's className and disabled state. That is a NEW silent failure of
+  // exactly the kind the whitelist exists to prevent, so they are forwarded.
+  'className',
+  'disabled',
+] as const;
+
+type DomPassThroughKey = (typeof DOM_PASS_THROUGH_KEYS)[number];
+
+/**
+ * Compile-time link to the declaration, direction 1 of 2: every key forwarded
+ * at runtime must exist on {@link FieldWidgetComponentProps}. Deleting a key
+ * from the contract without deleting it here is a compile error.
+ *
+ * Catches: helper forwards something the contract no longer declares.
+ */
+type EveryForwardedKeyIsDeclared =
+  DomPassThroughKey extends keyof FieldWidgetComponentProps ? true : never;
+const _everyForwardedKeyIsDeclared: EveryForwardedKeyIsDeclared = true;
+void _everyForwardedKeyIsDeclared;
+
+/**
+ * Direction 2 of 2: every key of {@link FieldWidgetDomProps} — the contract's
+ * DOM pass-through block — must be one this helper actually forwards. Adding a
+ * DOM key to the contract without adding it to `DOM_PASS_THROUGH_KEYS` is a
+ * compile error.
+ *
+ * Catches: DECLARED BUT NOT DELIVERED — a key that type-checks, reads as
+ * supported, and silently never reaches the element. That is the failure this
+ * repo treats as first-class (objectui#3290's `aria-required` that never
+ * reached a control; objectui#3222's validation slot nobody produced), and it
+ * is the one direction the leak test structurally CANNOT see: that test looks
+ * for attributes that arrive, not for ones that go missing.
+ *
+ * `className` / `disabled` are not part of `FieldWidgetDomProps` (they are
+ * controlled-input keys this helper also forwards — see above), so they are
+ * bound by direction 1 only. That is deliberate, not an oversight.
+ */
+type EveryDeclaredDomKeyIsForwarded =
+  keyof FieldWidgetDomProps extends DomPassThroughKey ? true : never;
+const _everyDeclaredDomKeyIsForwarded: EveryDeclaredDomKeyIsForwarded = true;
+void _everyDeclaredDomKeyIsForwarded;
+
+/**
+ * Direction 3, added with the core lift (objectui#4431): every key of the SDUI
+ * contract's own whitelist that this contract also declares must be forwarded
+ * here too, so the two lists cannot silently drift apart. `role` is the ONE
+ * measured exception — the SDUI contract declares it, this one does not — and
+ * naming it in the `Exclude` is what makes the divergence a deliberate,
+ * reviewable act rather than an omission.
+ *
+ * Catches: a key added to the shared SDUI set that field widgets quietly stop
+ * delivering.
+ */
+type SharedSduiKey = Exclude<SduiDomPassThroughKey, 'role'>;
+type EverySharedSduiKeyIsForwarded = SharedSduiKey extends DomPassThroughKey ? true : never;
+const _everySharedSduiKeyIsForwarded: EverySharedSduiKeyIsForwarded = true;
+void _everySharedSduiKeyIsForwarded;
+
+/** The subset of `P` this helper forwards, with each key's declared type. */
+export type DomProps<P> = CoreDomProps<P, DomPassThroughKey>;
+
+/**
+ * Keep only what may legitimately become a DOM attribute, and drop everything
+ * else — renderer plumbing, and any extra key an author put on the field
+ * config or SDUI node.
+ *
+ * Replaces the bare `{...props}` spread in every field widget that renders a
+ * host element:
+ *
+ * ```tsx
+ * // before — forwards whatever it was handed
+ * const { inputType, ...domProps } = props as any;
+ * return <Input {...domProps} … />;
+ *
+ * // after
+ * return <Input {...toDomProps(props)} … />;
+ * ```
+ *
+ * Semantic props a widget INTERPRETS (`value`, `onChange`, `field`,
+ * `readonly`, `error`, …) are read from `props` as before; this function only
+ * governs what gets spread.
+ */
+export function toDomProps<P extends object>(props: P): DomProps<P> {
+  return pickDomProps(props, DOM_PASS_THROUGH_KEYS);
+}