Problem
Ordinary shared components cannot reliably initialize or communicate on native. The goal is one STX component source across browser and native, with platform differences handled by the runtime.
Audited at v0.2.546, commit 0013ce66e38399bb23c86b5b666ac0792825bf1b.
Reproduced evidence
Compiling screens with the actual shared-library Button, TextInput, Select, and Dialog components, then executing each bundle in a DOM-free VM with a native bridge, throws:
ReferenceError: MutationObserver is not definedA plain signal-driven button/text screen works in the same harness. A shared Card also initializes.
Separately, a custom child with const emit = defineEmits(['change']) and a button calling emit('change', 'saved'), listened to by its parent, reports:
TypeError: target.dispatchEvent is not a functionSources:
Requested change
Make prop subscriptions and component event delivery host-independent. Preserve browser behavior, typed prop values, component event ownership/bubbling semantics, and cleanup. A no-op MutationObserver shim would only hide the failure, not deliver reactive props.
Acceptance
- The same shared-library component files initialize on browser and native.
- Parent prop changes reach child useReactiveProp signals.
- Child emits reach the correct parent with the correct payload.
- useModel/two-way bindings work in both directions without feedback loops.
- Hide/show, repeated instances, and teardown do not duplicate or leak subscriptions.
- Tests explicitly exercise shared components, not native primitive replacements.
Priority and validation
First in the portability audit sequence. Foundational for controls, forms, and overlays. Existing native suite: 360 passed; selected browser/component tests: 58 passed. These new probes expose coverage gaps despite those passing suites. No simulator validation was performed during this audit.