Changed according to code review by @igoradamenko

web/app/components/auth-panel/auth-panel.jsx

@@ -46,7 +46,7 @@ export default class AuthPanel extends Component {
               <strong className="auth-panel__username" onClick={this.toggleUserId}>{user.name}</strong>
               {isUserIdVisible && <span className="auth-panel__user-id"> ({user.id})</span>}.
               {' '}
-              <span className="auth-panel__pseudo-link" role="link" onClick={props.onSignOut}>Sign out?</span>
+              <span className="auth-panel__pseudo-link" role="link" tabIndex="0" onClick={props.onSignOut}>Sign out?</span>
             </div>
           )
         }
@@ -66,6 +66,7 @@ export default class AuthPanel extends Component {
                       <span
                         className="auth-panel__pseudo-link"
                         role="link"
+                        tabIndex="0"
                         onClick={() => props.onSignIn(provider)}
                       >{PROVIDER_NAMES[provider]}</span>
                     </span>
@@ -83,6 +84,7 @@ export default class AuthPanel extends Component {
               <span
                 className="auth-panel__pseudo-link auth-panel__admin-action"
                 role="link"
+                tabIndex="0"
                 onClick={this.toggleBlockedVisibility}
               >{isBlockedVisible ? 'Hide' : 'Show'} blocked</span>
             )

web/app/components/blocked-users/blocked-users.jsx

@@ -35,7 +35,7 @@ export default class BlockedUsers extends Component {
     const { users } = props;
 
     return (
-      <div className={b('blocked-users', props)}>
+      <div className={b('blocked-users', props)} role="region" aria-label="Blocked users">
         {
           !users.length && (
             <p>There are no blocked users.</p>

web/app/components/comment/comment.jsx

@@ -244,7 +244,7 @@ export default class Comment extends Component {
 
     if (mods.view === 'preview') {
       return (
-        <div className={b('comment', props, defaultMods)} role="listitem article" aria-level={mods.level}>
+        <article className={b('comment', props, defaultMods)}>
           <div className="comment__body">
             <div className="comment__info">
               <a href={`${o.locator.url}#${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`} className="comment__username">{o.user.name}</a>
@@ -255,12 +255,12 @@ export default class Comment extends Component {
               dangerouslySetInnerHTML={{ __html: o.text }}
             />
           </div>
-        </div>
+        </article>
       );
     }
 
     return (
-      <div className={b('comment', props, defaultMods)} id={mods.disabled ? null : `${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`}>
+      <article className={b('comment', props, defaultMods)} id={mods.disabled ? null : `${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`}>
         <div className="comment__body">
           <div className="comment__info">
             <img
@@ -286,7 +286,8 @@ export default class Comment extends Component {
                 <a
                   className="comment__link-to-parent"
                   href={`${o.locator.url}#${COMMENT_NODE_CLASSNAME_PREFIX}${o.pid}`}
-                  aria-label="Parent comment"
+                  aria-label="Go to parent comment"
+                  title="Go to parent comment"
                   onClick={this.scrollToParent}
                 />
               )
@@ -308,7 +309,7 @@ export default class Comment extends Component {
               <span
                 className={b('comment__vote', {}, { type: 'up', selected: scoreIncreased, disabled: isGuest || isCurrentUser })}
                 role="button"
-                aria-disabled={isGuest || isCurrentUser ? 'true' : 'false'}
+                aria-disabled={isGuest || isCurrentUser}
                 onClick={isGuest || isCurrentUser ? null : this.increaseScore}
                 title={isGuest ? 'Only authorized users are allowed to vote' : (isCurrentUser ? 'You can\'t vote for your own comment' : null)}
               >Vote up</span>
@@ -428,7 +429,7 @@ export default class Comment extends Component {
             />
           )
         }
-      </div>
+      </article>
     );
   }
 }

web/app/components/comment/comment.scss

@@ -1,4 +1,5 @@
 .comment {
+  display: block;
   position: relative;
   overflow: hidden;
   margin-bottom: 16px;

web/app/components/root/root.jsx

@@ -223,7 +223,7 @@ export default class Root extends Component {
 
                 {
                   !!pinnedComments.length && (
-                    <div className="root__pinned-comments" role="region" aria-label="Pinned Comments">
+                    <div className="root__pinned-comments" role="region" aria-label="Pinned comments">
                       {
                         pinnedComments.map(comment => (
                           <Comment
@@ -239,7 +239,7 @@ export default class Root extends Component {
 
                 {
                   !!comments.length && !isCommentsListLoading && (
-                    <div className="root__threads">
+                    <div className="root__threads" role="list">
                       {
                         comments.map(thread => (
                           <Thread
@@ -257,7 +257,7 @@ export default class Root extends Component {
 
                 {
                   isCommentsListLoading && (
-                    <div className="root__threads">
+                    <div className="root__threads" role="list">
                       <Preloader mix="root__preloader"/>
                     </div>
                   )
@@ -268,7 +268,7 @@ export default class Root extends Component {
 
           {
             isBlockedVisible && (
-              <div className="root__main" role="region" aria-label="Blocked Users">
+              <div className="root__main">
                 <BlockedUsers users={bannedUsers} onUnblock={this.onUnblockSomeone}/>
               </div>
             )

web/app/components/thread/thread.jsx

@@ -22,7 +22,10 @@ export default class Thread extends Component {
     const { data: { comment, replies = [] }, mix, mods = {}, onReplyClick } = props;
 
     return (
-      <div className={b('thread', props)} role="list" >
+      <div
+      className={b('thread', props)}
+      role={['listitem'].concat(!collapsed && replies.length ? 'list' : [])}
+      aria-expanded={!collapsed}>
         <Comment
           data={comment}
           mods={{ level: mods.level, collapsed, collapsible: !!replies.length }}