diff --git a/tests/resources/aria-at-harness.mjs b/tests/resources/aria-at-harness.mjs index b95489bc7..c5a4f1ac7 100644 --- a/tests/resources/aria-at-harness.mjs +++ b/tests/resources/aria-at-harness.mjs @@ -417,7 +417,7 @@ function renderVirtualInstructionDocument(doc) { type('checkbox'), value(failOption.description), id(`${failOption.description}-${commandIndex}`), - className([`undesirable-${commandIndex}`]), + className([`unexpected-${commandIndex}`]), tabIndex(failOption.tabbable ? '0' : '-1'), disabled(!failOption.enabled), checked(failOption.checked), @@ -436,28 +436,26 @@ function renderVirtualInstructionDocument(doc) { forInput(`${failOption.description}-${commandIndex}`), rich(failOption.description) ), - br(), - failOption.more - ? div( - label( - forInput(`${failOption.description}-${commandIndex}-input`), - rich(failOption.more.description) - ), - input( - type('text'), - id(`${failOption.description}-${commandIndex}-input`), - name(`${failOption.description}-${commandIndex}-input`), - className(['undesirable-other-input']), - disabled(!failOption.more.enabled), - value(failOption.more.value), - onchange(ev => - failOption.more.change( - /** @type {HTMLInputElement} */ (ev.currentTarget).value - ) - ) - ) + br() + ) + ), + fragment( + // TODO: Figure out why this isn't appearing + div( + label(forInput('unexpected-behavior-note'), rich('Add an explanation')), + input( + type('text'), + id('unexpected-behavior-note'), + name('unexpected-behavior-note'), + className(['unexpected-behavior-note']), + value(unexpected.failChoice.note.value), + disabled(!unexpected.failChoice.note.enabled), + onchange(ev => + unexpected.failChoice.note.change( + /** @type {HTMLInputElement} */ (ev.currentTarget).value ) - : fragment() + ) + ) ) ) ) @@ -592,9 +590,20 @@ function renderVirtualResultsTable(results) { * @param {object} list * @param {Description} list.description * @param {Description[]} list.items + * @param {String} [list.note] */ - function commandDetailsList({ description, items }) { - return div(description, ul(...items.map(description => li(rich(description))))); + function commandDetailsList({ + description, + items, + note: { value: noteValue = '', description: noteDescription } = {}, + }) { + return div( + description, + ul( + ...items.map(description => li(rich(description))), + noteValue.length ? li(rich(noteDescription), ' ', em(noteValue)) : fragment() + ) + ); } } diff --git a/tests/resources/aria-at-test-io-format.mjs b/tests/resources/aria-at-test-io-format.mjs index d28852e0f..33516457a 100644 --- a/tests/resources/aria-at-test-io-format.mjs +++ b/tests/resources/aria-at-test-io-format.mjs @@ -80,7 +80,7 @@ class KeysInput { modeInstructions: { reading: { jaws: `Verify the Virtual Cursor is active by pressing ${keys.ALT_DELETE}. If it is not, exit Forms Mode to activate the Virtual Cursor by pressing ${keys.ESC}.`, - nvda: `Ensure NVDA is in browse mode by pressing ${keys.ESC}. Note: This command has no effect if NVDA is already in browse mode.`, + nvda: `Insure NVDA is in browse mode by pressing ${keys.ESC}. Note: This command has no effect if NVDA is already in browse mode.`, voiceover_macos: `Toggle Quick Nav ON by pressing the ${keys.LEFT} and ${keys.RIGHT} keys at the same time.`, }[atKey], interaction: { @@ -917,8 +917,12 @@ export class TestRunInputOutput { behaviors: test.unexpectedBehaviors.map(({ description, requireExplanation }) => ({ description, checked: false, - more: requireExplanation ? { highlightRequired: false, value: '' } : null, + requireExplanation, })), + note: { + highlightRequired: false, + value: '', + }, }, }) ), @@ -1009,7 +1013,7 @@ export class TestRunInputOutput { ), unexpected_behaviors: command.unexpected.behaviors .filter(({ checked }) => checked) - .map(({ description, more }) => (more ? more.value : description)), + .map(({ description }) => description), })), }; @@ -1125,11 +1129,11 @@ export class TestRunInputOutput { behavior.checked ? { text: behavior.description, - otherUnexpectedBehaviorText: behavior.more ? behavior.more.value : null, } : null ) .filter(Boolean), + unexpectedBehaviorNote: command.unexpected.note.value || null, })), }; } @@ -1194,14 +1198,12 @@ export class TestRunInputOutput { return { ...behavior, checked: behaviorResult ? true : false, - more: behavior.more - ? { - highlightRequired: false, - value: behaviorResult ? behaviorResult.otherUnexpectedBehaviorText : '', - } - : behavior.more, }; }), + note: { + highlightRequired: false, + value: scenarioResult.unexpectedBehaviorNote || '', + }, }, }; }), diff --git a/tests/resources/aria-at-test-run.mjs b/tests/resources/aria-at-test-run.mjs index cfdc0b7e0..f9e1dd117 100644 --- a/tests/resources/aria-at-test-run.mjs +++ b/tests/resources/aria-at-test-run.mjs @@ -19,7 +19,7 @@ export class TestRun { setCommandAssertion: bindDispatch(userChangeCommandAssertion), setCommandHasUnexpectedBehavior: bindDispatch(userChangeCommandHasUnexpectedBehavior), setCommandUnexpectedBehavior: bindDispatch(userChangeCommandUnexpectedBehavior), - setCommandUnexpectedBehaviorMore: bindDispatch(userChangeCommandUnexpectedBehaviorMore), + setCommandUnexpectedBehaviorNote: bindDispatch(userChangeCommandUnexpectedBehaviorNote), setCommandOutput: bindDispatch(userChangeCommandOutput), submit: () => submitResult(this), ...hooks, @@ -230,7 +230,7 @@ export function instructionDocument(resultState, hooks) { ], unexpectedBehaviors: { description: [ - 'Were there additional undesirable behaviors?', + 'Were there additional unexpected behaviors?', { required: true, highlightRequired: resultStateCommand.unexpected.highlightRequired, @@ -238,7 +238,7 @@ export function instructionDocument(resultState, hooks) { }, ], passChoice: { - label: 'No, there were no additional undesirable behaviors.', + label: 'No, there were no additional unexpected behaviors.', checked: resultUnexpectedBehavior.hasUnexpected === HasUnexpectedBehaviorMap.DOES_NOT_HAVE_UNEXPECTED, @@ -254,9 +254,10 @@ export function instructionDocument(resultState, hooks) { }), }, failChoice: { - label: 'Yes, there were additional undesirable behaviors', + label: 'Yes, there were additional unexpected behaviors.', checked: - resultUnexpectedBehavior.hasUnexpected === HasUnexpectedBehaviorMap.HAS_UNEXPECTED, + resultUnexpectedBehavior.hasUnexpected === HasUnexpectedBehaviorMap.HAS_UNEXPECTED || + resultUnexpectedBehavior.expand, focus: resultState.currentUserAction === 'validateResults' && resultUnexpectedBehavior.highlightRequired && @@ -268,7 +269,7 @@ export function instructionDocument(resultState, hooks) { hasUnexpected: HasUnexpectedBehaviorMap.HAS_UNEXPECTED, }), options: { - header: 'Undesirable behaviors', + header: 'Unexpected behaviors', options: resultUnexpectedBehavior.behaviors.map((behavior, unexpectedIndex) => { return { description: behavior.description, @@ -279,7 +280,7 @@ export function instructionDocument(resultState, hooks) { checked: behavior.checked, focus: typeof resultState.currentUserAction === 'object' && - resultState.currentUserAction.action === UserObjectActionMap.FOCUS_UNDESIRABLE + resultState.currentUserAction.action === UserObjectActionMap.FOCUS_UNEXPECTED ? resultState.currentUserAction.commandIndex === commandIndex && resultUnexpectedBehavior.tabbedBehavior === unexpectedIndex : resultState.currentUserAction === UserActionMap.VALIDATE_RESULTS && @@ -301,33 +302,40 @@ export function instructionDocument(resultState, hooks) { } return false; }, - more: behavior.more - ? { - description: /** @type {Description[]} */ ([ - `If "other" selected, explain`, - { - required: true, - highlightRequired: behavior.more.highlightRequired, - description: '(required)', - }, - ]), - enabled: behavior.checked, - value: behavior.more.value, - focus: - resultState.currentUserAction === 'validateResults' && - behavior.more.highlightRequired && - focusFirstRequired(), - change: value => - hooks.setCommandUnexpectedBehaviorMore({ - commandIndex, - unexpectedIndex, - more: value, - }), - } - : null, }; }), }, + note: { + description: /** @type {Description[]} */ ([ + `Add an explanation`, + { + required: resultUnexpectedBehavior.behaviors.some( + ({ checked, requireExplanation }) => requireExplanation && checked + ), + highlightRequired: + resultState.currentUserAction === 'validateResults' && + resultUnexpectedBehavior.behaviors.some( + ({ checked, requireExplanation }) => requireExplanation && checked + ), + description: resultUnexpectedBehavior.behaviors.some( + ({ checked, requireExplanation }) => requireExplanation && checked + ) + ? ' (required)' + : ' (not required)', + }, + ]), + enabled: + resultUnexpectedBehavior.hasUnexpected === HasUnexpectedBehaviorMap.HAS_UNEXPECTED && + resultUnexpectedBehavior.behaviors.some(({ checked }) => checked), + value: resultUnexpectedBehavior.note.value, + focus: + resultState.currentUserAction === 'validateResults' && + resultUnexpectedBehavior.behaviors.some( + ({ checked, requireExplanation }) => requireExplanation && checked + ) && + focusFirstRequired(), + change: value => hooks.setCommandUnexpectedBehaviorNote({ commandIndex, note: value }), + }, }, }, }; @@ -455,7 +463,7 @@ export const UserActionMap = createEnumMap({ */ export const UserObjectActionMap = createEnumMap({ - FOCUS_UNDESIRABLE: 'focusUndesirable', + FOCUS_UNEXPECTED: 'focusUnexpected', }); /** @@ -596,13 +604,17 @@ export function userChangeCommandHasUnexpectedBehavior({ commandIndex, hasUnexpe ...command, unexpected: { ...command.unexpected, + expand: hasUnexpected === HasUnexpectedBehaviorMap.HAS_UNEXPECTED, hasUnexpected: hasUnexpected, tabbedBehavior: hasUnexpected === HasUnexpectedBehaviorMap.HAS_UNEXPECTED ? 0 : -1, behaviors: command.unexpected.behaviors.map(behavior => ({ ...behavior, checked: false, - more: behavior.more ? { ...behavior.more, value: '' } : null, })), + note: { + ...command.unexpected.note, + value: '', + }, }, } ), @@ -647,11 +659,10 @@ export function userChangeCommandUnexpectedBehavior({ commandIndex, unexpectedIn /** * @param {object} props * @param {number} props.commandIndex - * @param {number} props.unexpectedIndex - * @param {string} props.more + * @param {string} props.note * @returns {(state: TestRunState) => TestRunState} */ -export function userChangeCommandUnexpectedBehaviorMore({ commandIndex, unexpectedIndex, more }) { +export function userChangeCommandUnexpectedBehaviorNote({ commandIndex, note }) { return function (state) { return { ...state, @@ -663,17 +674,10 @@ export function userChangeCommandUnexpectedBehaviorMore({ commandIndex, unexpect ...command, unexpected: { ...command.unexpected, - behaviors: command.unexpected.behaviors.map((unexpected, unexpectedI) => - unexpectedI !== unexpectedIndex - ? unexpected - : /** @type {TestRunUnexpectedBehavior} */ ({ - ...unexpected, - more: { - ...unexpected.more, - value: more, - }, - }) - ), + note: { + ...command.unexpected.note, + value: note, + }, }, }) ), @@ -762,9 +766,14 @@ function isSomeFieldRequired(state) { command.unexpected.hasUnexpected === HasUnexpectedBehaviorMap.NOT_SET || (command.unexpected.hasUnexpected === HasUnexpectedBehaviorMap.HAS_UNEXPECTED && (command.unexpected.behaviors.every(({ checked }) => !checked) || - command.unexpected.behaviors.some( - behavior => behavior.checked && behavior.more && behavior.more.value.trim() === '' - ))) + command.unexpected.behaviors.some(behavior => { + return ( + behavior.checked && + behavior.requireExplanation && + command.unexpected.note && + command.unexpected.note.value.trim() === '' + ); + }))) ); } @@ -814,7 +823,7 @@ function resultsTableDocument(state) { if (command.unexpected.behaviors.some(({ checked }) => checked)) { unexpectedBehaviors = command.unexpected.behaviors .filter(({ checked }) => checked) - .map(({ description, more }) => (more ? more.value : description)); + .map(({ description }) => description); } return { @@ -851,8 +860,12 @@ function resultsTableDocument(state) { items: failingAssertions, }, unexpectedBehaviors: { - description: 'Unexpected Behavior', + description: 'Unexpected Behavior:', items: unexpectedBehaviors, + note: { + description: 'Explanation:', + value: command.unexpected.note.value, + }, }, }, }; @@ -896,7 +909,7 @@ export function userFocusCommandUnexpectedBehavior({ commandIndex, unexpectedInd return { ...state, currentUserAction: { - action: UserObjectActionMap.FOCUS_UNDESIRABLE, + action: UserObjectActionMap.FOCUS_UNEXPECTED, commandIndex, unexpectedIndex: newUnexpectedIndex, }, @@ -948,17 +961,14 @@ export function userValidateState() { command.unexpected.hasUnexpected === HasUnexpectedBehaviorMap.NOT_SET || (command.unexpected.hasUnexpected === HasUnexpectedBehaviorMap.HAS_UNEXPECTED && command.unexpected.behaviors.every(({ checked }) => !checked)), - behaviors: command.unexpected.behaviors.map(unexpected => { - return unexpected.more - ? { - ...unexpected, - more: { - ...unexpected.more, - highlightRequired: unexpected.checked && !unexpected.more.value.trim(), - }, - } - : unexpected; - }), + note: { + ...command.unexpected.note, + highlightRequired: + command.unexpected.note.value.trim() === '' && + command.unexpected.behaviors.some( + ({ checked, requireExplanation }) => requireExplanation && checked + ), + }, }, }; }), @@ -1168,13 +1178,13 @@ export function userValidateState() { * @property {(options: {commandIndex: number, hasUnexpected: HasUnexpectedBehavior}) => void } setCommandHasUnexpectedBehavior * @property {(options: {commandIndex: number, atOutput: string}) => void} setCommandOutput * @property {(options: {commandIndex: number, unexpectedIndex: number, checked}) => void } setCommandUnexpectedBehavior - * @property {(options: {commandIndex: number, unexpectedIndex: number, more: string}) => void } setCommandUnexpectedBehaviorMore + * @property {(options: {commandIndex: number, unexpectedIndex: number, more: string}) => void } setCommandUnexpectedBehaviorNote * @property {() => void} submit */ /** * @typedef UserActionFocusUnexpected - * @property {typeof UserObjectActionMap["FOCUS_UNDESIRABLE"]} action + * @property {typeof UserObjectActionMap["FOCUS_UNEXPECTED"]} action * @property {number} commandIndex * @property {number} unexpectedIndex */ diff --git a/tests/resources/at-commands.mjs b/tests/resources/at-commands.mjs index 1c1fdda8a..898bcc39e 100644 --- a/tests/resources/at-commands.mjs +++ b/tests/resources/at-commands.mjs @@ -35,7 +35,7 @@ export class commandsAPI { this.MODE_INSTRUCTIONS = { reading: { jaws: `Verify the Virtual Cursor is active by pressing ${keys.ALT_DELETE}. If it is not, exit Forms Mode to activate the Virtual Cursor by pressing ${keys.ESC}.`, - nvda: `Ensure NVDA is in browse mode by pressing ${keys.ESC}. Note: This command has no effect if NVDA is already in browse mode.`, + nvda: `Insure NVDA is in browse mode by pressing ${keys.ESC}. Note: This command has no effect if NVDA is already in browse mode.`, voiceover_macos: `Toggle Quick Nav ON by pressing the ${keys.LEFT} and ${keys.RIGHT} keys at the same time.`, }, interaction: { diff --git a/tests/resources/types/aria-at-test-result.js b/tests/resources/types/aria-at-test-result.js index ff989c6a5..be8cd78ac 100644 --- a/tests/resources/types/aria-at-test-result.js +++ b/tests/resources/types/aria-at-test-result.js @@ -34,5 +34,5 @@ * @property {object[]} scenarioResults[].unexpectedBehaviors * @property {string} scenarioResults[].unexpectedBehaviors[].id * @property {string} scenarioResults[].unexpectedBehaviors[].text - * @property {string | null} [scenarioResults[].unexpectedBehaviors[].otherUnexpectedBehaviorText] + * @property {string | null} [scenarioResults[].unexpectedBehaviorNote] */ diff --git a/tests/resources/types/aria-at-test-run.js b/tests/resources/types/aria-at-test-run.js index cdeceb90e..c12c3b142 100644 --- a/tests/resources/types/aria-at-test-run.js +++ b/tests/resources/types/aria-at-test-run.js @@ -16,12 +16,12 @@ */ /** - * @typedef {"focusUndesirable"} AriaATTestRun.UserActionObjectName + * @typedef {"focusUnexpected"} AriaATTestRun.UserActionObjectName */ /** * @typedef AriaATTestRun.UserActionFocusUnexpected - * @property {"focusUndesirable"} action + * @property {"focusUnexpected"} action * @property {number} commandIndex * @property {number} unexpectedIndex */