Merge pull request #468 from vgteam/fix-link

Fix link generation to include path

Author: adamnovak

src/components/CopyLink.js

@@ -31,18 +31,21 @@ export function CopyLink(props) {
     // https://github.com/ljharb/qs#stringifying
     const params = qs.stringify(viewTarget, { encodeValuesOnly: true });
     console.log("params ", params);
-    // complete url
-    const full = window.location.origin + "?" + params;
-    console.log(full);
+    
+    // Make a new URL based off the current one
+    let url = new URL(window.location.toString());
+    url.search = "?" + params;
+    url.hash = "";
+    console.log(url);
 
     try {
       // copy full to clipboard
-      copyCallback(full);
+      copyCallback(url.toString());
       // change text
       setText(CLICKED_TEXT);
     } catch (err) {
       setText(UNCLICKED_TEXT);
-      setDialogLink(full);
+      setDialogLink(url.toString());
       console.log("copy error");
     }
   };
@@ -79,11 +82,11 @@ export const urlParamsToViewTarget = (url) => {
   // and turn to object to populate in HeaderForm state and viewTarget
   // Returns: Object (viewTarget) - see App.js
 
-  var result = null;
-  const s = url.href.split("?");
+  let parsed = new URL(url);
+  let result = null;
   // If url contains information on viewObject
-  if (s[1]) {
-    result = qs.parse(s[1]);
+  if (parsed.search) {
+    result = qs.parse(parsed.search.substr(1));
   }
 
 

src/end-to-end.test.js

@@ -339,7 +339,7 @@ describe("When we wait for it to load", () => {
 it("produces correct link for view before & after go is pressed", async () => {
   // First test that after pressing go, the link reflects the dat form
   const expectedLinkBRCA1 =
-    "http://localhost?name=snp1kg-BRCA1&tracks[0][trackFile]=exampleData%2Finternal%2Fsnp1kg-BRCA1.vg.xg&tracks[0][trackType]=graph&tracks[0][trackColorSettings][mainPalette]=greys&tracks[0][trackColorSettings][auxPalette]=ygreys&tracks[1][trackFile]=exampleData%2Finternal%2FNA12878-BRCA1.sorted.gam&tracks[1][trackType]=read&region=17%3A1-100&bedFile=exampleData%2Finternal%2Fsnp1kg-BRCA1.bed&dataType=built-in&simplify=false&removeSequences=false";
+    "http://localhost/?name=snp1kg-BRCA1&tracks[0][trackFile]=exampleData%2Finternal%2Fsnp1kg-BRCA1.vg.xg&tracks[0][trackType]=graph&tracks[0][trackColorSettings][mainPalette]=greys&tracks[0][trackColorSettings][auxPalette]=ygreys&tracks[1][trackFile]=exampleData%2Finternal%2FNA12878-BRCA1.sorted.gam&tracks[1][trackType]=read&region=17%3A1-100&bedFile=exampleData%2Finternal%2Fsnp1kg-BRCA1.bed&dataType=built-in&simplify=false&removeSequences=false";
   // Set up dropdown
   await act(async () => {
     let dropdown = document.getElementById("dataSourceSelect");
@@ -373,7 +373,7 @@ it("produces correct link for view before & after go is pressed", async () => {
   await clickCopyLink();
 
   const expectedLinkCactus =
-    "http://localhost?tracks[0][trackFile]=exampleData%2Fcactus.vg.xg&tracks[0][trackType]=graph&tracks[1][trackFile]=exampleData%2Fcactus-NA12879.sorted.gam&tracks[1][trackType]=read&bedFile=exampleData%2Fcactus.bed&name=cactus&region=ref%3A1-100&dataType=built-in&simplify=false&removeSequences=false";
+    "http://localhost/?tracks[0][trackFile]=exampleData%2Fcactus.vg.xg&tracks[0][trackType]=graph&tracks[1][trackFile]=exampleData%2Fcactus-NA12879.sorted.gam&tracks[1][trackType]=read&bedFile=exampleData%2Fcactus.bed&name=cactus&region=ref%3A1-100&dataType=built-in&simplify=false&removeSequences=false";
   // Make sure link has changed after pressing go
   expect(fakeClipboard).toEqual(expectedLinkCactus);
 }, 20000);