Fix Specs, lint, fix test

webapp/components/comments/CommentList/CommentList.spec.js

@@ -86,7 +86,7 @@ describe('CommentList.vue', () => {
     })
 
     it('displays comments when there are comments to display', () => {
-      expect(wrapper.find('div#comments').text()).toEqual('this is a comment')
+      expect(wrapper.find('div.comments').text()).toEqual('this is a comment')
     })
 
     it("refetches a post's comments from the backend", () => {

webapp/components/comments/CommentList/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div id="comments">
     <h3 style="margin-top: -10px;">
       <span>
         <ds-icon name="comments" />
@@ -16,7 +16,7 @@
       </span>
     </h3>
     <ds-space margin-bottom="large" />
-    <div v-if="comments && comments.length" id="comments" class="comments">
+    <div v-if="comments && comments.length" class="comments">
       <comment
         v-for="(comment, index) in comments"
         :key="comment.id"

webapp/pages/post/_id.vue

@@ -77,6 +77,17 @@ export default {
       ]
     },
   },
+  watch: {
+    $route(to, from) {
+      if (to.hash === '#comments') {
+        window.scroll({
+          top: document.getElementById('comments').offsetTop,
+          left: 0,
+          behavior: 'smooth',
+        })
+      }
+    },
+  },
 }
 </script>