Skip to content

evaluate-response should be a single form with options #13

@zner0L

Description

@zner0L

Right now, the evaluate response page shows the options as different separate forms:

(['promise', 'denial', 'none'] as const).map((r) => (
<form class="radio-wrapper" method="POST" action={absUrl(`/p/${token}/evaluate-response/${r}`)}>
<button
type="submit"
class:list={['radio-label', { disabled: r === 'none' && !deadlineExpired }]}
disabled={r === 'none' && !deadlineExpired}>
{t('evaluate-response', `reponse-${r}`)}
</button>
</form>

However, semantically this should be an option input which submits a single form when clicked/focus is lost. This would require us to explain to users that a context change will occur (https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G13).

But instead, we could also provide a separate submit button altogether (labeled "Continue" or something), which I think is better practice anyway (https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G80). At least was a bit startled after clicking one of the links and immediately starting an analysis.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions