URLs within FAQ answers broken

  • Anchors within answers are broken, due to malformed aria-control attributes — note that the leading ‘h’ for the URL is being truncated. Looks like the JS responsible for the making the question accordions accessible is also affecting descendant elements within the answer tabs.

    Example code:
    <a href="https://www2.alliedtelecom.net/billing-portal-download-guide" target="_blank" rel="noopener" role="tab" tabindex="-1" aria-controls="ttp://www2.alliedtelecom.net/billing-portal-download-guide">https://www2.alliedtelecom.net/billing-portal-download-guide</a>

    • This topic was modified 6 years, 9 months ago by Tom Finley.
    • This topic was modified 6 years, 9 months ago by Tom Finley.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter Tom Finley

    (@hifidesign)

    On click, links generate the following console error:

    Error: Syntax error, unrecognized expression: #ttp://alliedtelecom.dev/wp-content/uploads/2018/01/allied-telecom-group-bill-center-setup.pdf

    Plugin Contributor Nick C

    (@modernnerd)

    Thanks for this report, @hifidesign!

    I haven’t been able to reproduce this so far with Genesis Simple FAQ, Genesis Sample, and the same content and links as your first question (click images to enlarge):

    Screenshot of two sites open with the same content, one of which displays a broken aria-controls attribute in links within Genesis Simple FAQ answers

    I notice that your theme also appears to include code that modifies the aria-controls attribute:

    Screenshot showing the theme's JavaScript modifying the aria-controls attribute

    If you switch theme temporarily or on a staging server, does the issue go away? You may wish to review your theme’s JavaScript if so.

    From what I can see of https://yypkaqh3belx66349sahr9zb-wpengine.netdna-ssl.com/wp-content/themes/allied/assets/scripts/allied-pro.js, it looks like this code:

    $('[role="tablist"] a').each(function() {
    $(this).attr(
      'aria-controls', $(this).attr('href').substring(1)
    );
  });

    Is applying to all tablists in error.

    It looks like the intention was to scope it to tablists inside the .feature-slides element, but the $container prefix may have been omitted from the start of the jQuery selector by mistake.

    • This reply was modified 6 years, 9 months ago by Nick C.
    • This reply was modified 6 years, 9 months ago by Nick C.
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘URLs within FAQ answers broken’ is closed to new replies.