[csds-client] Opening broswer issue while using visualization feature

[Rainton]

When we use visualization feature in the csds-client, the process is that the client parses the relationship between xDS and generates a graph based on the relationship in dot, then saves it in config_graph.dot. For example:

digraph G {
    "LDS0\\listener";
    "RDS0";
    "LDS0\\listener"->"RDS0";
}

Then the client will call OpenBrowser(url string) to open Graphviz Online with the dot file in the browser to show the graph automatically. For the previous graph example, the link would be https://dreampuf.github.io/GraphvizOnline/#digraph%20G{"LDS0\\listener";"RDS0";"LDS0\\listener"->"RDS0"}.

The logic of OpenBrowser(url string) is that it will run different cmd based on different os. For linux, it runs

xdg-open 'https://dreampuf.github.io/GraphvizOnline/#digraph G{"LDS0\\listener";"RDS0";"LDS0\\listener"->"RDS0"}'

---

However, the problem is that it seems this command passes the double quotes differently based on different os version.

• For Debian GNU/Linux rodete, which is the os of cloudtop of Google, when we run

  xdg-open 'https://dreampuf.github.io/GraphvizOnline/#digraph G{"LDS0\\listener";"RDS0";"LDS0\\listener"->"RDS0"}'

  it opens the link https://dreampuf.github.io/GraphvizOnline/#digraph%20G{LDS0\\listener;RDS0;LDS0\\listener->RDS0} in browser, where the double quotes are missing, therefore, the graph cannot be shown correctly due to syntax error. If we want to keep the double quotes in the link, we need to run

  xdg-open 'https://dreampuf.github.io/GraphvizOnline/#digraph G{\"LDS0\\listener\";\"RDS0\";\"LDS0\\listener\"->\"RDS0\"}'

  and it opens the link https://dreampuf.github.io/GraphvizOnline/#digraph%20G{"LDS0\\listener";"RDS0";"LDS0\\listener"->"RDS0"}, which is correct.

• For Debian GNU/Linux 10 (buster), when we run

  xdg-open 'https://dreampuf.github.io/GraphvizOnline/#digraph G{"LDS0\\listener";"RDS0";"LDS0\\listener"->"RDS0"}'

  it opens the link https://dreampuf.github.io/GraphvizOnline/#digraph%20G{"LDS0\\listener";"RDS0";"LDS0\\listener"->"RDS0"} correcly. But if we run the correct cmd in the previous case, it opens the link https://dreampuf.github.io/GraphvizOnline/#digraph%20G{\"LDS0\\listener\";\"RDS0\";\"LDS0\\listener\"->\"RDS0\"}, which is not correct.

  ---

  The different behavior on different os version leads to the opening browser issue, and I cannot find a proper solution to it. Does anyone has suggestions?

The double quotes surrounding the node name cannot be discarded, because the real name of xDS always contains a backslash, only using double quotes can make the dot language recognize it as a whole name.

For now, the solution is, if opening browser fails, users can manually copy and paste the content in config_graph.dot into the input box of Graphviz Online to show the graph, which has been mentioned in README.

[Rainton]

/cc @fuqianggao @alexburnos