Get Props

element.getProps()

Get the raw values for all props on a component instance.

This method returns all props defined on the component in the same order as in the instance props panel on the canvas. Each result includes the current value, which can be either a static value or a binding reference, and the hasOverride flag, which indicates whether the instance has overridden the component default.

To get the resolved values instead of the binding references, use element.getResolvedProps().

Syntax

1element.getProps(): Promise<InstancePropValue[]>

Related interfaces:

1interface InstancePropValue {
2 /** The prop's ID. */
3 propId: string;
4 /**
5 * The current value. Either:
6 * - A bare static value (string, number, boolean, object, null)
7 * - A binding reference: { sourceType: 'cms', collectionId, fieldId, ... }
8 * - An unsupported binding: { sourceType: 'conditional' } or { sourceType: 'legacy' }
9 */
10 value: unknown;
11 /** Whether this instance has overridden the component default. */
12 hasOverride: boolean;
13}

Returns

Promise<InstancePropValue[]>

A Promise that resolves to an array of prop values in panel display order.

Example

1// Get all elements on the page
2const elements = await webflow.getAllElements()
3const instanceEl = elements.find(el => el.type === 'ComponentInstance')
4
5if (instanceEl?.type === 'ComponentInstance') {
6
7 const props = await instanceEl.getProps()
8 console.log(props)
9
10 /*
11 [
12 { propId: 'prop_1', value: 'My Custom Title', hasOverride: true },
13 {
14 propId: 'prop_3',
15 value: {
16 sourceType: 'cms',
17 collectionId: 'col_abc123',
18 fieldId: 'field_author',
19 },
20 hasOverride: true,
21 },
22 { propId: 'prop_4', value: true, hasOverride: false },
23 ]
24 */
25
26} else {
27 console.log('No component instance found')
28}

Designer Ability

Checks for authorization only.

Designer AbilityLocaleBranchWorkflowSitemode
canAccessCanvasAnyAnyAnyAny