feat: open and close comments function

SuperViz · Sep 27, 2023 · 897fbb0 · 897fbb0
1 parent 5c58ebb
commit 897fbb0
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 0 deletions.
diff --git a/src/components/comments/index.test.ts b/src/components/comments/index.test.ts
@@ -80,6 +80,29 @@ describe('CommentsComponent', () => {
     expect(document.body.contains(commentsComponent['element'])).toBe(false);
   });
 
+  // test('should open component', () => {
+  //   commentsComponent['closeComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(false);
+  //   commentsComponent['openComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(true);
+  // });
+
+  // test('should close component', () => {
+  //   commentsComponent['openComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(true);
+  //   commentsComponent['closeComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(false);
+  // });
+
+  test('should toggle component', () => {
+    commentsComponent['toggle'](); // TODO: Remove it when toggle is implemented!
+
+    commentsComponent['toggle']();
+    expect(commentsComponent['element'].hasAttribute('open')).toBe(true);
+    commentsComponent['toggle']();
+    expect(commentsComponent['element'].hasAttribute('open')).toBe(false);
+  });
+
   test('should call apiService when fetch annotation', async () => {
     const spy = jest.spyOn(ApiService, 'fetchAnnotation');
 

diff --git a/src/components/comments/index.ts b/src/components/comments/index.ts
@@ -102,6 +102,23 @@ export class CommentsComponent extends BaseComponent {
     this.realtime.commentsObserver.unsubscribe(this.onAnnotationListUpdate);
   }
 
+  // openComments(): void {
+  //   this.element.setAttributeNode(document.createAttribute('open'));
+  // }
+
+  // closeComments(): void {
+  //   this.element.removeAttribute('open');
+  // }
+
+  toggle(): void {
+    if (this.element.hasAttribute('open')) {
+      this.element.removeAttribute('open');
+      return;
+    }
+
+    this.element.setAttributeNode(document.createAttribute('open'));
+  }
+
   /**
    * @function createAnnotation
    * @description Creates a new annotation and comment and adds them to the Comments component