refactor(downloads-list): improve components, move fixtures

add tests for filtering
geonetwork · Jun 22, 2022 · 1146c3a · 1146c3a
1 parent c16b90b
commit 1146c3a
Show file tree

Hide file tree

Showing 8 changed files with 70 additions and 25 deletions.
diff --git a/libs/ui/elements/src/lib/downloads-list/downloads-list.component.spec.ts b/libs/ui/elements/src/lib/downloads-list/downloads-list.component.spec.ts
@@ -8,11 +8,11 @@ import {
 import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { By } from '@angular/platform-browser'
 import {
+  LINK_FIXTURES,
   LinkHelperService,
   MetadataLinkValid,
 } from '@geonetwork-ui/util/shared'
 import { TranslateModule } from '@ngx-translate/core'
-import { LINK_FIXTURES } from '../../../../../util/shared/src/lib/links/link.fixtures'
 
 import { DownloadsListComponent } from './downloads-list.component'
 
@@ -24,7 +24,7 @@ const linkHelperServiceMock = {
   selector: 'gn-ui-download-item',
   template: ``,
 })
-export class DownloadItemComponentMock {
+class MockDownloadItemComponent {
   @Input() link: MetadataLinkValid
   @Input() color: string
 }
@@ -37,7 +37,7 @@ describe('DownloadsListComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot()],
-      declarations: [DownloadsListComponent, DownloadItemComponentMock],
+      declarations: [DownloadsListComponent, MockDownloadItemComponent],
       schemas: [NO_ERRORS_SCHEMA],
       providers: [
         {
@@ -63,16 +63,65 @@ describe('DownloadsListComponent', () => {
     fixture.detectChanges()
     expect(component).toBeTruthy()
   })
+
+  describe('when a list of downloads', () => {
+    let items: DebugElement[]
+
+    beforeEach(() => {
+      component.links = [
+        LINK_FIXTURES.dataCsv,
+        LINK_FIXTURES.dataPdf,
+        LINK_FIXTURES.dataPdf,
+      ]
+      fixture.detectChanges()
+      items = de.queryAll(By.directive(MockDownloadItemComponent))
+    })
+    it('contains one link', () => {
+      expect(items.length).toBe(3)
+    })
+  })
   describe('when link format is unknown', () => {
     let items: DebugElement[]
 
     beforeEach(() => {
       component.links = [LINK_FIXTURES.unknownFormat]
       fixture.detectChanges()
-      items = de.queryAll(By.directive(DownloadItemComponentMock))
+      items = de.queryAll(By.directive(MockDownloadItemComponent))
     })
     it('contains one link', () => {
       expect(items.length).toBe(1)
     })
   })
+  describe('hydrates link with color and format', () => {
+    let items: DebugElement[]
+
+    beforeEach(() => {
+      component.links = [LINK_FIXTURES.geodataShpWithMimeType]
+      fixture.detectChanges()
+      items = de.queryAll(By.directive(MockDownloadItemComponent))
+    })
+    it('contains color, isWfs & format', () => {
+      expect(items.length).toBe(1)
+      expect(items[0].componentInstance.link).toEqual({
+        ...LINK_FIXTURES.geodataShpWithMimeType,
+        color: 'var(--color-gray-700)',
+        format: '',
+        isWfs: true,
+      })
+    })
+  })
+  describe('filtering', () => {
+    let items: DebugElement[]
+
+    beforeEach(() => {
+      component.links = [{ ...LINK_FIXTURES.dataCsv, format: 'csv' }]
+      component.activeFilterFormats = ['csv', 'json']
+      fixture.detectChanges()
+    })
+    it('csv link is displayed', () => {
+      expect(component.filteredLinks.length).toBe(1)
+      component.toggleFilterFormat('csv')
+      expect(component.filteredLinks.length).toBe(0)
+    })
+  })
 })
diff --git a/libs/ui/elements/src/lib/downloads-list/downloads-list.component.ts b/libs/ui/elements/src/lib/downloads-list/downloads-list.component.ts
@@ -53,9 +53,8 @@ export class DownloadsListComponent implements OnInit {
   }
 
   ngOnInit(): void {
-    this.processedLinks = this.formatLinks(this.links)
-    this.processedLinks = this.assignColor(this.processedLinks)
-    this.processedLinks = this.isGeneratedFromWfs(this.processedLinks)
+    this.processedLinks = this.assignColor(this.links)
+    this.processedLinks = this.formatWfs(this.processedLinks)
     this.filteredLinks = this.filterLinks(this.processedLinks)
 
     this.filterButtons = this.filterFormats.map((format) => {
@@ -66,15 +65,6 @@ export class DownloadsListComponent implements OnInit {
     })
   }
 
-  formatLinks(links) {
-    return links.map((link) => {
-      return {
-        ...link,
-        format: link.format ? link.format.split(':').at(-1) : '',
-      }
-    })
-  }
-
   filterLinks(links: MetadataLinkValid[]) {
     if (
       this.activeFilterFormats.length === 0 ||
@@ -107,13 +97,18 @@ export class DownloadsListComponent implements OnInit {
     })
   }
 
-  isGeneratedFromWfs(links: MetadataLinkValid[]) {
+  formatWfs(links: MetadataLinkValid[]) {
     return links.map((link) => {
-      if (!this.linkHelper.isWfsLink(link)) return link
-      return {
-        ...link,
-        isWfs: true,
+      if (this.linkHelper.isWfsLink(link)) {
+        const { format = '' } = link
+        const tokens = format.split(':')
+        link = {
+          ...link,
+          isWfs: true,
+          format: tokens[tokens.length - 1],
+        }
       }
+      return link
     })
   }
 }

diff --git a/libs/ui/elements/tsconfig.lib.json b/libs/ui/elements/tsconfig.lib.json
@@ -7,7 +7,7 @@
     "declarationMap": true,
     "inlineSources": true,
     "types": [],
-    "lib": ["dom", "es2018"]
+    "lib": ["dom", "es2022"]
   },
   "exclude": [
     "src/test-setup.ts",

diff --git a/libs/util/shared/src/lib/fixtures/index.ts b/libs/util/shared/src/lib/fixtures/index.ts
@@ -1,4 +1,5 @@
 export * from './geojson.fixtures'
 export * from './ol-feature.fixture'
 export * from './record-link.fixtures'
+export * from './link.fixtures'
 export * from './records'
diff --git a/...til/shared/src/lib/links/link.fixtures.ts → .../shared/src/lib/fixtures/link.fixtures.ts b/...til/shared/src/lib/links/link.fixtures.ts → .../shared/src/lib/fixtures/link.fixtures.ts
diff --git a/libs/util/shared/src/lib/links/link-classifier.service.spec.ts b/libs/util/shared/src/lib/links/link-classifier.service.spec.ts
@@ -1,5 +1,5 @@
 import { LinkClassifierService, LinkUsage } from './link-classifier.service'
-import { LINK_FIXTURES } from './link.fixtures'
+import { LINK_FIXTURES } from '../fixtures/link.fixtures'
 
 describe('LinkClassifierService', () => {
   let service: LinkClassifierService

diff --git a/libs/util/shared/src/lib/links/link-helper.service.spec.ts b/libs/util/shared/src/lib/links/link-helper.service.spec.ts
@@ -5,7 +5,7 @@ import { MetadataLink, MetadataRecord } from '../models'
 import { LinkClassifierService, LinkUsage } from './link-classifier.service'
 
 import { LinkHelperService } from './link-helper.service'
-import { LINK_FIXTURES } from './link.fixtures'
+import { LINK_FIXTURES } from '../fixtures/link.fixtures'
 
 let linkUsage: LinkUsage[]
 const linkClassifierMock = {

diff --git a/libs/util/shared/src/lib/links/link-utils.spec.ts b/libs/util/shared/src/lib/links/link-utils.spec.ts
@@ -7,7 +7,7 @@ import {
   sortPriority,
   FORMATS,
 } from './link-utils'
-import { LINK_FIXTURES } from './link.fixtures'
+import { LINK_FIXTURES } from '../fixtures/link.fixtures'
 
 jest.mock('@camptocamp/ogc-client', () => ({
   WfsEndpoint: class {