Mixins / foldkit-mixins/testing

Inert

namespace · packages/mixins/src/testing.ts:241

const Inert = {
  draw,
  css,
  missingTokens,
  bySlot,
  unslotted,
  fixedInline,
  all,
  children,
  byTag,
  text,
  value,
  classes,
  style,
  byRole,
  byLabel,
  pressed,
}

In the guides

Members

Inert.draw

function · packages/mixins/src/testing.ts:112

draw<Slots, Input, Message>(
  view: SlotView.SlotView<Slots, Input, Message>,
  input: Input,
): Html

A SlotView drawn inert, each element a Slot draws marked with the Slot's name, however deeply nested its view, for bySlot and unslotted. Only here: a view drawn for real carries no mark.

It draws under a Foldkit Scene's render frame, which h.submodel and a Submodel's childAttributes need; nothing is dispatched, and no Command or Mount the drawing declares is run or checked.

Inert.css

function · packages/mixins/src/testing.ts:210

css(nodes: ReadonlyArray<Html>): string

The compiled CSS behind the classes on nodes, after the standard layer order.

Inert.missingTokens

function · packages/mixins/src/testing.ts:221

missingTokens(root: Html, stylesheet: string): ReadonlyArray<string>

The --fk-* tokens the tree's Styles read with no fallback and that nothing defines, in first-read order: not stylesheet, not a drawn rule, not an inline style. Such a read makes its declaration invalid, so a test asserts toEqual([]). A tree whose Styles read no token passes too; check css for var(--fk- when that would be a mistake.

Inert.bySlot

function · packages/mixins/src/testing.ts:145

bySlot(root: Html | undefined, slot: string): ReadonlyArray<Node>

Every element a Slot drew, in a tree from draw.

Inert.unslotted

function · packages/mixins/src/testing.ts:181

unslotted(
  root: Html | undefined,
  options?: {
    readonly inside?: ReadonlyArray<string>
  },
): ReadonlyArray<string>

Every element in a tree from draw that no Slot drew, by its path: markup a stylist could reach only through a selector into the package. What a Slot named in inside holds is not the package's, such as a canvas drawing the application's own page, and is skipped.

Inert.fixedInline

function · packages/mixins/src/testing.ts:197

fixedInline(
  root: Html | undefined,
  options?: {
    readonly inside?: ReadonlyArray<string>
  },
): ReadonlyArray<string>

Every inline declaration that is not a custom property, by its element's path, skipping what a Slot named in inside holds: a fixed value inline outranks every rule, so a later layer could not override it. A value known only per element belongs in a custom property that a rule reads.

Inert.all

function · packages/mixins/src/testing.ts:20

all(root: Html | undefined): ReadonlyArray<Node>

Every node under root, itself first, depth first.

Inert.children

function · packages/mixins/src/testing.ts:29

children(node: Html | undefined): ReadonlyArray<Node>

A node's children that are nodes, not plain strings.

Inert.byTag

function · packages/mixins/src/testing.ts:33

byTag(root: Html | undefined, tag: string): ReadonlyArray<Node>

Every element under root with this tag.

Inert.text

function · packages/mixins/src/testing.ts:37

text(node: Html | undefined): string

The text under a node, joined.

Inert.value

function · packages/mixins/src/testing.ts:46

value(node: Html | undefined, key: string): unknown

An attribute or a property, whichever the builder wrote; the attribute first.

Inert.classes

function · packages/mixins/src/testing.ts:52

classes(node: Html | undefined): ReadonlyArray<string>

The classes on a node, in the order the builder wrote them.

Inert.style

function · packages/mixins/src/testing.ts:58

style(node: Html | undefined): Readonly<Record<string, string>>

The inline style on a node, empty when it has none.

Inert.byRole

function · packages/mixins/src/testing.ts:61

byRole(root: Html | undefined, role: string): ReadonlyArray<Node>

Every element under root with this role.

Inert.byLabel

function · packages/mixins/src/testing.ts:69

byLabel(root: Html | undefined, label: string): ReadonlyArray<Node>

Every element under root named label: by its aria-label, by the text of a <label for> pointing at its id, or by its own text. By text, only the innermost element counts, not every ancestor whose text is the same.

Inert.pressed

function · packages/mixins/src/testing.ts:94

pressed(node: Html | undefined): Option.Option<boolean>

Whether a toggle button is pressed; none when it is not a toggle.