Referencedescription

<description>

Extra information about an enclosing component, shown to all users in a popup or disclosure

<description> provides extra information about an enclosing component. The information is shown to all users, but it is not displayed inline: Doenet renders it behind an info icon, so a reader must open a popover (or expand a disclosure triangle) to see it.

Because a <description> does not appear to assistive technology as a direct label of a component, it does not satisfy the accessibility requirement for labeling. For inputs and answers that include an input, the accessibility requirement can be met by either

  • adding a <label> that is visible to sighted users as well (preferred), or
  • adding a <shortDescription> as a label that is available solely for assistive technology.

For image-like components (including graphs and videos) that don’t accept a direct <label>, you need to use <shortDescription> to add a text alternative for assistive technology.

In best practice, a <description> is combined with a <label> or <shortDescription> to provide additional detail for everyone.

A <description> is meaningful as a child of <answer>, <mathInput>, <textInput>, <booleanInput>, <choiceInput>, <matrixInput>, <image>, <video>, and <graph>. It accepts block content such as paragraphs.

Attributes and Properties

Attributes for <description>

Common to all components (9)
copy

reference. Create an independent copy of another component by reference. Enter a references a $name.

disabled

boolean. Default value: false. Whether this component is disabled and cannot be interacted with.

extend

reference. Extend another component by reference, inheriting its children and attributes. Enter a reference as $name.

fixed

boolean. Default value: false. Whether this component's value is fixed and cannot be modified.

fixLocation

boolean. Default value: false. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

hide

boolean. Default value: false. Whether to hide this component from the rendered output.

isResponse

boolean. Default value: false. Whether this component is treated as a response for the purposes of assessment.

name

text. The name used to reference this component from elsewhere in the document.

styleNumber

integer. Default value: 1. The style number used to select this component's visual styling from the available style definitions.

Properties for <description name="d">

Other (4)
$d.disabled

boolean. Whether this component is disabled and cannot be interacted with.

$d.fixed

boolean. Whether this component's value is fixed and cannot be modified.

$d.fixLocation

boolean. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

$d.hidden

boolean. Whether this component is hidden from the rendered output.

Common to all components (4)
$d.doenetML

text. The DoenetML source code that produced this component.

$d.hide

boolean. Whether to hide this component from the rendered output.

$d.isResponse

boolean. Whether this component is treated as a response for the purposes of assessment.

$d.styleNumber

integer. The style number used to select this component's visual styling from the available style definitions.

Examples

Example: <description> on a <mathInput>

On an input component, a <description> appears as an info icon next to the input. Selecting the icon opens a popover with the description, so the extra guidance is available without cluttering the page.

Example: <description> on an <image>

Here the <image> carries both a <shortDescription>, which provides the accessible text alternative for screen readers, and a <description> with a longer explanation. On a block-mode <image> the description is revealed by a disclosure triangle below the image.

Example: <description> on a <graph>

A <graph> can likewise pair a <shortDescription> for assistive technology with a <description> that gives sighted users more context about the graph’s contents.

derivativedisplayDoenetML