Merge pull request #58 from unipept/fix/overwrite-id

Fix for element ID gets overwritten
unipept · Apr 30, 2021 · f63d510 · f63d510
2 parents 0e060d4 + 100f667
commit f63d510
Show file tree

Hide file tree

Showing 6 changed files with 6 additions and 17 deletions.
diff --git a/src/utilities/TooltipUtilities.ts b/src/utilities/TooltipUtilities.ts
@@ -1,10 +1,9 @@
 import * as d3 from "d3";
 
 export default class TooltipUtilities {
-    public static initTooltip(elementId: string): d3.Selection<HTMLDivElement, unknown, HTMLElement, any> {
+    public static initTooltip(): d3.Selection<HTMLDivElement, unknown, HTMLElement, any> {
         return d3.select("body")
             .append("div")
-            .attr("id", elementId + "-tooltip")
             .attr("class", "tip")
             .style("position", "absolute")
             .style("z-index", "10")

diff --git a/src/utilities/__tests__/TooltipUtilities.spec.ts b/src/utilities/__tests__/TooltipUtilities.spec.ts
@@ -2,9 +2,8 @@ import TooltipUtilities from "./../TooltipUtilities";
 
 describe("TooltipUtilities.initTooltip", () => {
     it("should produce a tooltip that satisfies the requirements", () => {
-        const tooltip = TooltipUtilities.initTooltip("unique-identifier");
+        const tooltip = TooltipUtilities.initTooltip();
 
-        expect(tooltip.attr("id")).toContain("unique-identifier");
         expect(tooltip.attr("class")).toEqual("tip");
     });
 });
diff --git a/src/visualizations/heatmap/Heatmap.ts b/src/visualizations/heatmap/Heatmap.ts
@@ -77,7 +77,6 @@ export default class Heatmap {
         this.settings = this.fillOptions(options);
 
         this.element = elementIdentifier;
-        this.element.id = "U_HEATMAP_" + Math.floor(Math.random() * 2**16);
 
         const preprocessor = new Preprocessor();
         this.rows = preprocessor.preprocessFeatures(rowLabels);
@@ -950,7 +949,6 @@ export default class Heatmap {
     private initTooltip() {
         return d3.select("body")
             .append("div")
-            .attr("id", this.element.id + "-tooltip")
             .attr("class", "tip")
             .style("position", "absolute")
             .style("z-index", "10")

diff --git a/src/visualizations/sunburst/Sunburst.ts b/src/visualizations/sunburst/Sunburst.ts
@@ -45,13 +45,11 @@ export default class Sunburst {
     ) {
         this.settings = this.fillOptions(options);
 
-        this.element.id = "U_SUNBURST_" + Math.floor(Math.random() * 2**16);
-
         const preprocessor = new SunburstPreprocessor();
         const processedData = preprocessor.preprocessData(data);
 
         if (this.settings.enableTooltips) {
-            this.tooltip = TooltipUtilities.initTooltip(this.element.id);
+            this.tooltip = TooltipUtilities.initTooltip();
         }
 
         this.currentMaxLevel = this.settings.levels;
@@ -80,7 +78,7 @@ export default class Sunburst {
         // @ts-ignore
         this.breadCrumbs = d3.select(this.element)
             .append("div")
-            .attr("id", this.element.id + "-breadcrumbs")
+            .attr("id", Math.floor(Math.random() * 2**16) + "-breadcrumbs")
             .attr("class", "sunburst-breadcrumbs")
             .append("ul");
 

diff --git a/src/visualizations/treemap/Treemap.ts b/src/visualizations/treemap/Treemap.ts
@@ -33,11 +33,8 @@ export default class Treemap {
     ) {
         this.settings = this.fillOptions(options);
 
-
-        this.element.id = "U_TREEMAP_" + Math.floor(Math.random() * 2**16);
-
         if (this.settings.enableTooltips) {
-            this.tooltip = TooltipUtilities.initTooltip(this.element.id);
+            this.tooltip = TooltipUtilities.initTooltip();
         }
 
         this.initCss();

diff --git a/src/visualizations/treeview/Treeview.ts b/src/visualizations/treeview/Treeview.ts
@@ -38,10 +38,8 @@ export default class Treeview {
     ) {
         this.settings = this.fillOptions(options);
 
-        this.element.id = "U_TREEVIEW_" + Math.floor(Math.random() * 2**16);
-
         if (this.settings.enableTooltips) {
-            this.tooltip = TooltipUtilities.initTooltip(this.element.id);
+            this.tooltip = TooltipUtilities.initTooltip();
         }
 
         const dataProcessor = new TreeviewPreprocessor();