Keyboard interactions

[NickGreen]

Keyboard interactions aren't currently working as expected on https://feedland.blog/blogroll-wp-plugin-test/

Expected behavior

When the Blogroll div is in focus, we should be able to click up and down with the keyboard to navigate, and press enter to open each line.

Observed behavior

The keyboard interactions aren't navigating within the #BlogrollContainer div.

Details

• If we force the focus state on that div within the inspector, it works.
• isBlogrollFocus() is evaluating to false because the div isn't in focus

Solution

• We need to add tabindex attribute

Change this:

function feedland_blogroll_shortcode(): string {
    return '<div id="divBlogrollContainer"></div><script>$=jQuery;blogroll(BLOGROLL_OPTIONS);</script>';
}

to this:

function feedland_blogroll_shortcode(): string {
    return '<div id="divBlogrollContainer" tabindex="0"></div><script>$=jQuery;blogroll(BLOGROLL_OPTIONS);</script>';
}

[scripting]

Good report.

I didn't write explicit instructions, I probably should, but the example code does have the tabindex attribute.

<div class="divBlogrollContainer" id="idBlogrollContainer" tabindex="0">
        </div>

[NickGreen]

Perfect. Looks like that was missed. We've got that added now, so closing this out.