Skip to content

Commit

Permalink
Small accessibility push (#4840)
Browse files Browse the repository at this point in the history
fixes 
#4762
<!-- Link to relevant issue (for ex: "fixes #1234") which will
automatically close the issue once the PR is merged -->

## PR Type
<!-- Please uncomment one ore more that apply to this PR -->

Bugfix
<!-- - Feature -->
<!-- - Code style update (formatting) -->
<!-- - Refactoring (no functional changes, no api changes) -->
<!-- - Build or CI related changes -->
<!-- - Documentation content changes -->
<!-- - Sample app changes -->
<!-- - Other... Please describe: -->


## Describe the current behavior?
<!-- Please describe the current behavior that is being modified or link
to a relevant issue. -->
4762 - required fields in manifest editor are not announced as
"required" by narrator

## Describe the new behavior?
4762 - required fields in manifest editor are announced as "required" by
narrator

## PR Checklist
- [x] Test: run `npm run test` and ensure that all tests pass
- [x] Target main branch (or an appropriate release branch if
appropriate for a bug fix)
- [x] Ensure that your contribution follows [standard accessibility
guidelines](https://docs.microsoft.com/en-us/microsoft-edge/accessibility/design).
Use tools like https://webhint.io/ to validate your changes.


## Additional Information
  • Loading branch information
Jaylyn-Barbee authored Oct 29, 2024
1 parent 9257da1 commit ac0c6e8
Show file tree
Hide file tree
Showing 3 changed files with 7 additions and 7 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -545,7 +545,7 @@ export class ManifestInfoForm extends LitElement {
<p class="field-desc">(required)</p>
</div>
<p class="field-desc">The name of your app as displayed to the user</p>
<sl-input placeholder="PWA Name" value=${this.manifest.name! || ""} data-field="name" @sl-change=${this.handleInputChange}></sl-input>
<sl-input placeholder="PWA Name" value=${this.manifest.name! || ""} data-field="name" @sl-change=${this.handleInputChange} required="true"></sl-input>
</div>
<div class="form-field">
<div class="field-header">
Expand All @@ -557,7 +557,7 @@ export class ManifestInfoForm extends LitElement {
<p class="field-desc">(required)</p>
</div>
<p class="field-desc">Used in app launchers</p>
<sl-input placeholder="PWA Short Name" value=${this.manifest.short_name! || ""} data-field="short_name" @sl-change=${this.handleInputChange}></sl-input>
<sl-input placeholder="PWA Short Name" value=${this.manifest.short_name! || ""} data-field="short_name" @sl-change=${this.handleInputChange} required="true"></sl-input>
</div>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -604,7 +604,7 @@ export class ManifestSettingsForm extends LitElement {
<p class="field-desc">(required)</p>
</div>
<p class="field-desc">The URL that loads when your PWA starts</p>
<sl-input placeholder="PWA Start URL" value=${this.manifest.start_url! || ""} data-field="start_url" @sl-change=${this.handleInputChange}></sl-input>
<sl-input placeholder="PWA Start URL" value=${this.manifest.start_url! || ""} data-field="start_url" @sl-change=${this.handleInputChange} required="true"></sl-input>
</div>
<div class="form-field">
<div class="field-header">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -939,7 +939,7 @@ export class ManifestShareForm extends LitElement {
<p class="field-desc">(required)</p>
</div>
<p class="field-desc">The URL for the web share target </p>
<sl-input name="action" placeholder="Add action (ex: /share-receiver)" value=${this.manifest.share_target?.action! || ""} @sl-change=${() => this.handleTopLevelInputChange("action")} data-field="share_target.action"></sl-input>
<sl-input name="action" placeholder="Add action (ex: /share-receiver)" value=${this.manifest.share_target?.action! || ""} @sl-change=${() => this.handleTopLevelInputChange("action")} data-field="share_target.action" required="true"></sl-input>
<p class="action-error-message error-message">Action is a required field and must be in the scope of your PWA</p>
</div>
<div class="form-field">
Expand Down Expand Up @@ -997,7 +997,7 @@ export class ManifestShareForm extends LitElement {
<manifest-field-tooltip .field=${"share_target.params.title"}></manifest-field-tooltip>
</div>
</div>
<sl-input name="title" class="params" placeholder="Add title" value=${this.manifest.share_target?.params?.title! || ""} @sl-change=${() => this.handleParameterInputChange("title")} data-field="share_target.params.title"></sl-input>
<sl-input name="title" class="params" placeholder="Add title" value=${this.manifest.share_target?.params?.title! || ""} @sl-change=${() => this.handleParameterInputChange("title")} data-field="share_target.params.title" required="true"></sl-input>
</div>
<div class="form-field">
<div class="field-header">
Expand All @@ -1006,7 +1006,7 @@ export class ManifestShareForm extends LitElement {
<manifest-field-tooltip .field=${"share_target.params.text"}></manifest-field-tooltip>
</div>
</div>
<sl-input name="text" class="params" placeholder="Add text" value=${this.manifest.share_target?.params?.text! || ""} @sl-change=${() => this.handleParameterInputChange("text")} data-field="share_target.params.text"></sl-input>
<sl-input name="text" class="params" placeholder="Add text" value=${this.manifest.share_target?.params?.text! || ""} @sl-change=${() => this.handleParameterInputChange("text")} data-field="share_target.params.text" required="true"></sl-input>
</div>
<div class="form-field">
<div class="field-header">
Expand All @@ -1015,7 +1015,7 @@ export class ManifestShareForm extends LitElement {
<manifest-field-tooltip .field=${"share_target.params.url"}></manifest-field-tooltip>
</div>
</div>
<sl-input name="url" class="params" placeholder="Add url" value=${this.manifest.share_target?.params?.url! || ""} @sl-change=${() => this.handleParameterInputChange("url")} data-field="share_target.params.url"></sl-input>
<sl-input name="url" class="params" placeholder="Add url" value=${this.manifest.share_target?.params?.url! || ""} @sl-change=${() => this.handleParameterInputChange("url")} data-field="share_target.params.url" required="true"></sl-input>
</div>
</div>
<div class="form-row long">
Expand Down

0 comments on commit ac0c6e8

Please sign in to comment.