title: Some links with accented characters and dot doesn't open on Chrome, Explorer and Edge
body: <p>I'm dealing with an issue at my work that I had never seen. When I'm developing I use always Firefox and generating an HTML by a XSL on JAVA I tested the links on Firefox and ALL works, even if they have or not accented characters or dots at the end of the URL (<a href="https://..........some" rel="nofollow noreferrer">https://..........some</a> words**.**) When you click on the link it sends you to the bottom of the page where is the info of that link (<a href="https://...............#name" rel="nofollow noreferrer">https://...............#name</a> displayed on the clicked link</p>
  
  <p>But today, my boss openned an issue telling me that on Chrome, Edge and Explorer, the links with accented characters or dots on the URL can't be openned. So I tried click some links and on Chrome, some works and others not work..... On Explorer and Edge none works. I'm very rookie dealing with display browser problems.</p>
  
  <p>So, I've checked the code that transforms the XML template to HTML and I tried to add this two lines:</p>
  
  <pre><code>transformer.setOutputProperty(OutputKeys.METHOD, "text/html");
  transformer.setOutputProperty(OutputKeys.ENCODING, "UTF-8");
  </code></pre>
  
  <p>(With these two lines, the browser shows a ? instead the accented characters, I don't know why)</p>
  
  <p>Moreover, on the XML template I've added:</p>
  
  <pre><code>&lt;xsl:template match="/"&gt;
          &lt;html&gt;
              &lt;head&gt;
                  &lt;meta charset="UTF-8"&gt;&lt;/meta&gt;
                  &lt;meta http-equiv="content-type" content="text/html; charset=UTF-8"&gt; &lt;/meta&gt;
                  &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt; &lt;/meta&gt;
              &lt;/head&gt;
  ...... more template code ......
  </code></pre>
  
  <p>But the result it's the same. On Firefox all links work, on Chrome some yes and some no, on Explorer and Edge none of them.</p>
  
  <p>Why it works on Firefox and on the rest of all no?</p>
  
  <p>Regards.</p>
  
  <p>------------- UPDATE -------------</p>
  
  <p>The file it's generated by a desktop application and creates a html file that it's opened at the end of the process by the default browser of the system.</p>
  
  <p>I thought that the problem was not encoding on UTF-8, but I've changed the encondig to the original (ISO-8859-1) because the result it's the same.</p>
  
  <p>The code is:</p>
  
  <pre><code>public URL createHTML(ReportValidationTO validationTO) throws IOException, SAXException, IntrospectionException {
      try {
          PATH_XML = File.createTempFile("validacion", ".xml").getAbsolutePath();
          String path_xsl = ConfigurationParametersManager.getParameter(PATH_XSL);
          BeanReader reader = new BeanReader();
          reader.registerBeanClass("validation", ReportValidationTO.class);
          BeanWriter bWriter = initHTML();
          AttributeDescriptor a1 = new AttributeDescriptor("validationName");
          ElementDescriptor e1 = new ElementDescriptor();
          e1.addAttributeDescriptor(a1);
          XMLBeanInfo xmlInfo = new XMLBeanInfo(ReportValidationTO.class);
          xmlInfo.setElementDescriptor(e1);
          bWriter.write("validationTO", validationTO);
          bWriter.flush();
          InputStream inputXSL = getClass().getResourceAsStream(path_xsl);
          URL retorno = (URL) transformToHTML(PATH_XML, inputXSL);
          return retorno;
      } catch (Exception e) {
          logger.info("No se pudo cargar el archivo ");
          logger.info("El error fue : " + e.getClass().getName() + " " + e.getMessage());
          return null;
      }
  }
  
  
  private BeanWriter initHTML() throws IOException, MissingConfigurationParameterException {
          FileWriter fWriter = new FileWriter(PATH_XML);
          BeanWriter bWriter = new BeanWriter(fWriter);
          bWriter.setIndent("\t");
          String path_xsl = ConfigurationParametersManager.getParameter(PATH_XSL);
          URL url_xsl = getClass().getResource(path_xsl);
          String encoding = "&lt;?xml version=" + "\"1.0\"" + " encoding=" + "\"ISO-8859-1\"" + " standalone=" + "\"yes\"" + "?&gt;";
          String xslFile = "&lt;?xml-stylesheet type=" + "\"text/xsl\"" + " href=" + "\"" + url_xsl + "\"" + "?&gt;";
          bWriter.writeXmlDeclaration(encoding);
          bWriter.writeXmlDeclaration(xslFile);
          return bWriter;
      }
  </code></pre>
  
  <p>And then:</p>
  
  <pre><code>private URL transformToHTML(String sXMLData, InputStream inputXSL) {
      try {
          Source xmlSource = new StreamSource(new File(sXMLData));
          Source xsltSource = new StreamSource(inputXSL);
          StringWriter cadenaSalida = new StringWriter();
          Result bufferResultado = new StreamResult(cadenaSalida);
          TransformerFactory factoriaTrans = TransformerFactory.newInstance();
          Transformer transformador = factoriaTrans.newTransformer(xsltSource);
          transformador.setOutputProperty(OutputKeys.METHOD, "html");
          transformador.setOutputProperty(OutputKeys.ENCODING, "ISO-8859-1");
          transformador.transform(xmlSource, bufferResultado);
          File salida = File.createTempFile("validacion", ".html");
          FileOutputStream out = new FileOutputStream(salida);
          byte[] bytesSalida = cadenaSalida.toString().getBytes();
          out.write(bytesSalida);
          out.close();
          URL url = salida.toURI().toURL();
          return url;
      } catch (Exception e) {
          logger.info("\nERROR EN TRANSFORM HTML VALIDACIONES");
          logger.error(LoggerHelper.getStackTrace(e));
          return null;
      }
  }
  </code></pre>
  
  <p>------- Update with some HTML code -------</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;a href="#Linked Example"&gt;&lt;font face="Verdana" color="#003399"&gt;&lt;b&gt;Title Example&lt;/b&gt;&lt;/font&gt;&lt;/a&gt;
  &lt;ul type="disc"&gt;
  &lt;li&gt;
  &lt;a href="#Link 1: Frase con acentos, est%C3%A1 en ejecuci%C3%B3n"&gt;&lt;font size="-1" face="Verdana"&gt;SERIALNUMER2: Frase con acentos, el estado est&amp;aacute; en ejecuci&amp;oacute;n&lt;/font&gt;&lt;/a&gt;&lt;a&gt;&lt;font size="-1" color="red" face="Verdana"&gt;
                  [Fails:
                  3
                  ]
                 &lt;/font&gt;&lt;/a&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;a name="Linked Example"&gt;&lt;/a&gt;&lt;b&gt;&lt;font size="+1" face="Verdana"&gt;After click on the second link from above, it should send you here&lt;/font&gt;&lt;/b&gt;
  &lt;hr color="black" WIDTH="100%"&gt;
  &lt;br&gt;
  &lt;a name="Link 1: Frase con acentos, el estado est%C3%A1 en ejecuci%C3%B3n"&gt;&lt;/a&gt;&lt;b&gt;&lt;font size="-1" face="Verdana"&gt;Validacion:&lt;/font&gt;&lt;/b&gt;&lt;font size="-1" face="Verdana"&gt;SERIALNUMER2: Frase con acentos, el estado est&amp;aacute; en ejecuci&amp;oacute;n&lt;/font&gt;
  &lt;br&gt;
  &lt;b&gt;&lt;font size="-1" face="Verdana"&gt;Solution:&lt;/font&gt;&lt;/b&gt;&lt;font size="-1" face="Verdana"&gt;None&lt;/font&gt;
  &lt;br&gt;
  &lt;br&gt;
  &lt;table WIDTH="100%" BORDER="1"&gt;
  &lt;caption&gt;
  &lt;font size="+1" face="Verdana" color="red"&gt;Error list&lt;/font&gt;
  &lt;/caption&gt;
  &lt;tr&gt;
  &lt;th align="LEFT" bgcolor="dddddd"&gt;&lt;b&gt;column1&lt;/b&gt;&lt;/th&gt;&lt;th align="LEFT" bgcolor="dddddd"&gt;&lt;b&gt;column2&lt;/b&gt;&lt;/th&gt;&lt;th align="LEFT" bgcolor="dddddd"&gt;&lt;b&gt;column3&lt;/b&gt;&lt;/th&gt;&lt;th align="LEFT" bgcolor="dddddd"&gt;&lt;b&gt;column4&lt;/b&gt;&lt;/th&gt;&lt;th align="LEFT" bgcolor="dddddd"&gt;&lt;b&gt;column5&lt;/b&gt;&lt;/th&gt;&lt;th align="LEFT" bgcolor="dddddd"&gt;&lt;b&gt;column6&lt;/b&gt;&lt;/th&gt;&lt;th align="LEFT" bgcolor="dddddd"&gt;&lt;b&gt;column7&lt;/b&gt;&lt;/th&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td align="LEFT"&gt;2000&lt;/td&gt;&lt;td align="LEFT"&gt;15&lt;/td&gt;&lt;td align="LEFT"&gt;019&lt;/td&gt;&lt;td align="LEFT"&gt;001&lt;/td&gt;&lt;td align="LEFT"&gt;1087&lt;/td&gt;&lt;td align="LEFT"&gt;0&lt;/td&gt;&lt;td align="LEFT"&gt;B&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td align="LEFT"&gt;2000&lt;/td&gt;&lt;td align="LEFT"&gt;15&lt;/td&gt;&lt;td align="LEFT"&gt;019&lt;/td&gt;&lt;td align="LEFT"&gt;001&lt;/td&gt;&lt;td align="LEFT"&gt;1113&lt;/td&gt;&lt;td align="LEFT"&gt;0&lt;/td&gt;&lt;td align="LEFT"&gt;B&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
  &lt;td align="LEFT"&gt;2000&lt;/td&gt;&lt;td align="LEFT"&gt;15&lt;/td&gt;&lt;td align="LEFT"&gt;069&lt;/td&gt;&lt;td align="LEFT"&gt;001&lt;/td&gt;&lt;td align="LEFT"&gt;125&lt;/td&gt;&lt;td align="LEFT"&gt;0&lt;/td&gt;&lt;td align="LEFT"&gt;B&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;br&gt;
  &lt;b&gt;&lt;font size="-1" color="#FF0000" face="Verdana"&gt;
             Total:
             3
             fail(s)
            &lt;/font&gt;&lt;/b&gt;
  &lt;br&gt;
  &lt;b&gt;&lt;font size="-1" face="Verdana"&gt;
             The end
             :
            &lt;/font&gt;&lt;/b&gt;&lt;b&gt;&lt;font color="red" size="-1" face="Verdana"&gt;Problems found&lt;/font&gt;&lt;/b&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>On the snippet, here:</p>
  
  <pre><code>href="#Link 1: Frase con acentos, est%C3%A1 en ejecuci%C3%B3n"
  </code></pre>
  
  <p>and here:</p>
  
  <pre><code>name="Link 1: Frase con acentos, el estado est%C3%A1 en ejecuci%C3%B3n"
  </code></pre>
  
  <p>To make it work on Edge, I need replace <em>%C3%A1</em> with <em>a</em> and <em>%C3%B3</em> with <em>o</em> if you want to get redirected to the position on the page where are the details of the link.</p>