SVG as data URI triggers XML parsing error in Firefox - css

I made a codepen demo illustrating the problem: codepen.io/acusti/pen/mJmVRy
And here’s the error I get if I try to load the svg content in Firefox:
XML Parsing Error: unclosed token
Location: data:image/svg+xml;utf8,<svg%20viewBox='0%200%20120%20120'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'><circle%20cx='45'%20cy='45'%20r='30'%20fill='#555555'></circle></svg>
Line Number 1, Column 77:
<svg viewBox='0 0 120 120' version='1.1' xmlns='http://www.w3.org/2000/svg'><circle cx='45' cy='45' r='30' fill='
----------------------------------------------------------------------------^
Note: I get that error by clicking on the data URI string in the Firefox developer tools (inside the CSS Rules panel while inspecting the .separator element), where a tooltip says “Could not load the image”. You can do the same thing by just copy-pasting the Location string from the error message above into your Firefox address bar.

It is not valid for data URIs to contain # characters like yours has, you must escape them as %23
The unescaped # character is reserved to indicate the start of a fragment identifier. Firefox is quite right to indicate a parsing error.

you can use the online tool https://www.zhangxinxu.com/sp/svgo/
it support let special characters encoded, such as:
"" => %22
# => %23
% => %25
...

Related

CSS Error parsing ( Expected LBRACE at [1,9] )

My css has the following error code.
CSS Error parsing file:/C:/Users/dsm/Desktop/efxclipse/workspace/style/css/a.css: Expected LBRACE at [1,9]
I searched the Internet for an answer, and it says, at line 1, col 9 I am missing left brace { . However, if you look at my code line 1. I don't know where to put {. Can anyone have any advice?
#CHARSET "UTF-8"; //this is my code line 1
JavaFX cannot parse this line and will throw an exception.
You should only use #charset if style sheet and the HTML-file, that is calling the style sheet, have different encodings.
If a parser has problems with this line, it should be save to omit it - as long as your files are encoded correctly in UTF-8.

Newlines entered in Firefox not dislplaying in SQR Report

Let's say I have a text field here named "Description". In the Description field, I entered the following text:
This is line 1.
This is line 2.
This is line 3.
When I input these text to the Description field using IE or Chrome and run the SQR process, the description is displayed correctly including the newlines. But when I enter the same description using Firefox (v35.0.1 btw), the description is being printed in the report like this:
This is line 1. This is line 2. This is line 3.
I am sure that in my SQR there are no procedures that strip off the newlines (because it is working with IE and Chrome). I have also validated backend that the description has newlines.
Using the data entered in Firefox, I also tried running the report in IE and Chrome, but the newlines are still not displaying.
Can you tell me why is this happening? Is there a difference between the newlines used by IE, Chrome, and Firefox?
This is a known issue, google firefox textarea newline.
Firefox represents an newline as linefeed character ascii(10) whereas internet explorer as a combination of carriage return character and linefeed character ascii(13) ascii(10).
To ensure the data is saved in the way it's required for your further processes, you could add component record peoplecode, SavePreChange:
/* Newline is Char13)+Char(10) */
YOUR_REC.YOUR_FLD.Value = Substitute(
Substitute(YOUR_REC.YOUR_FLD.Value,
Char(13) | Char(10),
Char(10)),
Char(10),
Char(13) | Char(10));

I can't get any unicode to work for degrees celsius.

I'm trying to get the degrees celsius symbol to show up using the pseudo selector :after but can't seem to any unicode to work. Using the symbol I have in place now prints a capital A before the degree symbol.
.temp:after{
content:"°C";
}
I’m pretty sure it actually prints “°”, i.e. capital A with circumflex before the degree sign. The reason is that the file containing the CSS code is UTF-8 encoded but being interpreted as windows-1252 encoded. (The degree sign, U+00B0, is 0xC2 0xB0 in UTF-8 encoding; if this is interpreted as windows-1252, or as ISO-8859-1, you get U+00C2 U+00B0, that is °.)
The solution is to declare the encoding of the file as UTF-8. The details depend on whether the CSS code is inside an HTML document or in a CSS file, and it may also depend on the server software. See the W3C page Character encodings.
If the code is in an CSS file, the simplest fix is to save that file, in your editor, as UTF-8 with BOM. Depending on software, this might be simply flagged as “UTF-8” (as opposite to “UTF-8 without BOM”). Another way is to write the following at the very start of the CSS file:
#charset "UTF-8";
this: content:'\00b0 C'; seems to work for me ? http://codepen.io/anon/pen/kvyFh
this could be helpfull to you : http://unicode-table.com/en/#00B0 (it gives you html entities code too ° )

Validation not possible

I wanted to validate my Website for example with http://validator.w3.org but I always get the following error:
Sorry, I am unable to validate this document because on line 11 it
contained one or more bytes that I cannot interpret as utf-8 (in other
words, the bytes found are not valid values in the specified Character
Encoding). Please check both the content of the file and the character
encoding indication. The error was: utf8 "\xFC" does not map to
Unicode
Does anybody know where I can locate/get rid of the error?
open the css-file with your favorite text editor.
There, switch the encoding to UTF8.
Goto line 11 and look for strange looking symbols.
Delete/replace them.

XSLT. load xml document that contains escape characters

I use XSLT to transform an XML document which I then load on to a ASP.NET website. However, if the XML contains '<' characters, the XML becomes malformed.
<title><b> < left arrows <b></title>
If I use disable-output-escaping="yes", the XML cannot be loaded and I get the error "Name cannot begin with the '' character".
If I do not disable output escaping the escaped characters are disregarded and the text appears as it is:
<title><b> < left arrows <b></title>
I want the bold tags to work, but I also want to escape the '<' character. Ideally
<b>< left arrows</b>
is what I want to achieve. Is there any solution for this?
The XML should contain the escaped sequence for the less than sign (<), not the literal < character. The XML is malformed and any XML parser must reject it.
In XSLT you could generate that sequence like this:
<xsl:text>&lt;<xsl:text>
From what I understand, the input contains HTML and literal < characters. In that case, disable-output-escaping="yes" will preserve the HTML tags but produce invalid XML and setting it to no means the HTML tags will be escaped.
What you need to do is to leave set disable-output-escaping="no" (which is the default, you don't actually have to add that) and add a XSLT rule that will copy the HTML tags. For instance:
<xsl:template match="*">
<xsl:copy>
<xsl:copy-of select="#*" />
<xsl:apply-templates />
</xsl:copy>
</xsl:template>
I came up with a solution and was triggered by the last answer by Josh. Thanks Josh. I tried to used the match template, however I had a problem as the html tags are placed within cdata, so I had difficulties doing a match. There might be a way to do it, but I gave up on that.
What I did was to do a test="contain($text, $replace)" where the $replace is the '<' character and on top of that, I also added a condition to test if the substring after the '<' is a relevant html tag such that it is actually a <b> or </b>. So if it's just a '<' character not belonging to any html tags, I will convert '<' to ampersand, &lt;. Basically that solved my problem. Hope this is useful to anyone who encounter the same problem as me.

Resources