VACMS-19163: changed required astrisk to after

[jv-agile6]

Description

Relates to #19163

QA steps

name: "Campaign Landing Page - Spotlight Validation"

description: QA test for ensuring required fields and validation indicators appear correctly when editing a Campaign Landing Page, and that error messages are properly linked to the corresponding fields.

steps:

• step: "Go to Tugboat instance Log in and create a new Campaign Landing Page."
  expected_result: "Login and successfully go to create a Campaign Landing Page"

  

• step: "Fill out the required fields in the Hero Banner, Why This Matters, What You Can Do, VA Benefits sections. and Selection settings"
  expected_result: "Required fields are filled out without issues."

• step: "Save as Published and save the node."
  expected_result: "Node is saved successfully."

• step: "Edit the node and enable the Spotlight section by clicking 'Enable this page segment.'"
  expected_result: "Spotlight section is enabled."

• step: "Check if the 'List of links with summaries' field is marked as required (red asterisk)."
  expected_result: "The 'List of links with summaries' field is marked with a red asterisk."

• step: "Add a Link teaser to the 'Links with summaries' field."
  expected_result: "Link teaser is added successfully."

• step: "Save the node again."
  expected_result: "Node is saved successfully without errors."

expected_behavior:

• "Required field 'List of links with summaries' should have a red asterisk."

Definition of Done

• Documentation has been updated, if applicable.
• Tests have been added if necessary.
• Automated tests have passed.
• Code Quality Tests have passed.
• Acceptance Criteria in related issue are met.
• Manual Code Review Approved.
• If there are field changes, front end output has been thoroughly checked.

Select Team for PR review

• CMS Team
• Public websites
• Facilities
• User support
• Accelerated Publishing

Is this PR blocked by another PR?

• DO NOT MERGE

Does this PR need review from a Product Owner

• Needs PO review

CMS user-facing announcement

Is an announcement needed to let editors know of this change?

• Yes, and it's written in issue ____ and queued for publication.
  • Merge and ping the UX writer so they are ready to publish after deployment
• Yes, but it hasn't yet been written
  • Don't merge yet -- ping the UX writer to write and queue content
• No announcement is needed for this code change.
  • Merge & carry on unburdened by announcements

[github-actions]

Checking composer.lock changes...

[github-actions]

Checking composer.lock changes...

[github-actions]

GitHub Workflows (.github/workflows/*.yml)

Have you...

• pinned all affected GitHub Actions at a specific commit by SHA?
• reviewed the source code of the action at the commit you are pinning?
• confirmed that no GitHub security measures are being bypassed?
• checked for any injection of user content into protected contexts?
• reviewed Security hardening for GitHub Actions?
• reviewed GitHub Workflows?

[github-actions]

Checking composer.lock changes...

[github-actions]

Checking composer.lock changes...

[github-actions]

Checking composer.lock changes...

[dsasser]

Some nitpicks, but also seeing duplicate required indicators on the link field:

[github-actions]

Checking composer.lock changes...

[jv-agile6]

Some nitpicks, but also seeing duplicate required indicators on the link field:

These styles are pre-exsiting from form.css

.form-item__label.form-required::after, .fieldset__label.form-required::after {
    display: inline-block;
    margin-inline: 0.15em;
    content: "*";
    color: var(--color-maximumred);
    font-size: 0.875rem;
}

[github-actions]

Checking composer.lock changes...

[dsasser]

This selector isn't completely accurate in that it is targetted even when the field isn't required. Is there some reason we can't add the [required] attribute to the selector?

[jv-agile6]

I discovered the styles for the asterisk on form.css and was trying to follow it consistency. I can update and add [required].

[github-actions]

Checking composer.lock changes...

[va-cms-bot]

va/tests/status-error:

coverage_core

Title       Drupal core security coverage

Severity    Error

Sid         2

Description Update to a supported minor [1] as soon as possible to continue receiving

security updates. Visit the release cycle overview [2] for more information

on supported releases.

        [1] http://default/admin/reports/updates                                      
        [2] https://www.drupal.org/core/release-cycle-overview                        

Value       Coverage has ended
entity_update

Title       Entity/field definitions

Severity    Error

Sid         2

Description The following changes were detected in the entity type and field definitions.

.... Consumer
         * The /Authorization code scopes/ field needs to be uninstalled.             

Value       Mismatched entity and/or field definitions

[va-cms-bot]

Cypress Accessibility Violations

/test-data-aut

ID: button-name
Impact: critical
Tags: cat.name-role-value, wcag2a, wcag412, section508, section508.22.a, TTv5, TT6.a, EN-301-549, EN-9.4.1.2, ACT
Description: Ensure buttons have discernible text
Help: Buttons must have discernible text
Nodes:

• HTML: <button class="proofing-element-help" role="tooltip" data-proofing-help-title="About 'Page introduction' field" data-proofing-help="Add an introduction that helps visitors understand if information on the page is relevant to them."> <span aria-hidden="true">i</span> </button>
  Impact: critical
  Target: .field--name-field-intro-text-limited-html > .field__label > .proofing-element-help[role="tooltip"]
  Summary: Fix any of the following:
  Element does not have inner text that is visible to screen readers
  aria-label attribute does not exist or is empty
  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
  Element has no title attribute
  Element does not have an implicit (wrapped) <label>
  Element does not have an explicit <label>
  Element's default semantics were not overridden with role="none" or role="presentation"

• HTML: <button class="proofing-element-help" role="tooltip" data-proofing-help-title="About 'Generate a table of contents from major headings' field" data-proofing-help="By checking this box, all h2's below this point on the page will be linked with with anchor links. This helps users navigate content on very long pages. Do not check this box unless there is at least 2 h2's on the page.">
  Impact: critical
  Target: .field--name-field-table-of-contents-boolean > .field__label > .proofing-element-help[role="tooltip"]
  Summary: Fix any of the following:
  Element does not have inner text that is visible to screen readers
  aria-label attribute does not exist or is empty
  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
  Element has no title attribute
  Element does not have an implicit (wrapped) <label>
  Element does not have an explicit <label>
  Element's default semantics were not overridden with role="none" or role="presentation"

• HTML: <button class="proofing-element-help" role="tooltip" data-proofing-help-title="About 'Main content' field" data-proofing-help="The main body of the page, which appears below the featured content."> <span aria-hidden="true">i</span> </button>
  Impact: critical
  Target: button[data-proofing-help-title="About 'Main content' field"]
  Summary: Fix any of the following:
  Element does not have inner text that is visible to screen readers
  aria-label attribute does not exist or is empty
  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
  Element has no title attribute
  Element does not have an implicit (wrapped) <label>
  Element does not have an explicit <label>
  Element's default semantics were not overridden with role="none" or role="presentation"