#1 disable inlne styling
Merged 4 years ago by jlanda. Opened 4 years ago by jlanda.

@@ -1,1 +1,1 @@ 

- !function(e,n){"use strict";function t(){var e=n.createElement("style");e.type="text/css",e.innerHTML=u(".{0}{border-collapse:collapse}.{0} td{padding:0}.{1}:before{content:attr({2})}",[f,v,b]),n.getElementsByTagName("head")[0].appendChild(e)}function r(t){"interactive"===n.readyState||"complete"===n.readyState?l(t):e.addEventListener("DOMContentLoaded",function(){l(t)})}function l(t){try{var r=n.querySelectorAll("code.hljs");for(var l in r)r.hasOwnProperty(l)&&i(r[l],t)}catch(o){e.console.error("LineNumbers error: ",o)}}function i(e,n){if("object"==typeof e){n=n||{singleLine:!1};var t=n.singleLine?0:1;h(function(){a(e),e.innerHTML=o(e.innerHTML,t)})}}function o(e,n){var t=c(e);if(""===t[t.length-1].trim()&&t.pop(),t.length>n){for(var r="",l=0,i=t.length;l<i;l++)r+=u('<tr><td class="{0}"><a class="{1} {2}" {3}="{5}" href="#_{5}" id="_{5}"></a></td><td class="{4}"><div class="{1}">{6}</div></td></tr>',[m,g,v,b,p,l+1,t[l].length>0?t[l]:" "]);return u('<table class="{0}">{1}</table>',[f,r])}return e}function a(e){var n=e.childNodes;for(var t in n)if(n.hasOwnProperty(t)){var r=n[t];d(r.textContent)>0&&(r.childNodes.length>0?a(r):s(r.parentNode))}}function s(e){var n=e.className;if(/hljs-/.test(n)){for(var t=c(e.innerHTML),r=0,l="";r<t.length;r++){var i=t[r].length>0?t[r]:" ";l+=u('<span class="{0}">{1}</span>\n',[n,i])}e.innerHTML=l.trim()}}function c(e){return 0===e.length?[]:e.split(j)}function d(e){return(e.trim().match(j)||[]).length}function h(n){e.setTimeout(n,0)}function u(e,n){return e.replace(/\{(\d+)\}/g,function(e,t){return n[t]?n[t]:e})}var f="hljs-ln",g="hljs-ln-line notblue text-muted",p="hljs-ln-code pl-2",m="hljs-ln-numbers bg-light text-right pr-2 pl-2 border-right mr-3",v="hljs-ln-n",b="data-line-number",j=/\r\n|\r|\n/g;e.hljs?(e.hljs.initLineNumbersOnLoad=r,e.hljs.lineNumbersBlock=i,t()):e.console.error("highlight.js not detected!")}(window,document); 

\ No newline at end of file

+ !function(n,t){"use strict";function e(e){"interactive"===t.readyState||"complete"===t.readyState?r(e):n.addEventListener("DOMContentLoaded",function(){r(e)})}function r(e){try{var r=t.querySelectorAll("code.hljs");for(var l in r)r.hasOwnProperty(l)&&i(r[l],e)}catch(o){n.console.error("LineNumbers error: ",o)}}function i(n,t){if("object"==typeof n){t=t||{singleLine:!1};var e=t.singleLine?0:1;h(function(){o(n),n.innerHTML=l(n.innerHTML,e)})}}function l(n,t){var e=a(n);if(""===e[e.length-1].trim()&&e.pop(),e.length>t){for(var r="",i=0,l=e.length;i<l;i++)r+=u('<tr><td class="{0}"><a class="{1} {2}" {3}="{5}" href="#_{5}" id="_{5}"></a></td><td class="{4}"><div class="{1}">{6}</div></td></tr>',[v,f,m,p,g,i+1,e[i].length>0?e[i]:" "]);return u('<table class="{0}">{1}</table>',[d,r])}return n}function o(n){var t=n.childNodes;for(var e in t)if(t.hasOwnProperty(e)){var r=t[e];c(r.textContent)>0&&(r.childNodes.length>0?o(r):s(r.parentNode))}}function s(n){var t=n.className;if(/hljs-/.test(t)){for(var e=a(n.innerHTML),r=0,i="";r<e.length;r++){var l=e[r].length>0?e[r]:" ";i+=u('<span class="{0}">{1}</span>\n',[t,l])}n.innerHTML=i.trim()}}function a(n){return 0===n.length?[]:n.split(j)}function c(n){return(n.trim().match(j)||[]).length}function h(t){n.setTimeout(t,0)}function u(n,t){return n.replace(/\{(\d+)\}/g,function(n,e){return t[e]?t[e]:n})}var d="hljs-ln",f="hljs-ln-line notblue text-muted",g="hljs-ln-code pl-2",v="hljs-ln-numbers bg-light text-right pr-2 pl-2 border-right mr-3",m="hljs-ln-n",p="data-line-number",j=/\r\n|\r|\n/g;n.hljs?(n.hljs.initLineNumbersOnLoad=e,n.hljs.lineNumbersBlock=i):n.console.error("highlight.js not detected!")}(window,document); 

\ No newline at end of file

@@ -14,27 +14,10 @@ 

      if (w.hljs) {

          w.hljs.initLineNumbersOnLoad = initLineNumbersOnLoad;

          w.hljs.lineNumbersBlock = lineNumbersBlock;

- 

-         addStyles();

      } else {

          w.console.error('highlight.js not detected!');

      }

  

-     function addStyles () {

-         var css = d.createElement('style');

-         css.type = 'text/css';

-         css.innerHTML = format(

-             '.{0}{border-collapse:collapse}\

-             .{0} td{padding:0}\

-             .{1}:before{content:attr({2})}',

-         [

-             TABLE_NAME,

-             NUMBER_LINE_NAME,

-             DATA_ATTR_NAME

-         ]);

-         d.getElementsByTagName('head')[0].appendChild(css);

-     }

- 

      function initLineNumbersOnLoad (options) {

          if (d.readyState === 'interactive' || d.readyState === 'complete') {

              documentReady(options);

This module is inyecting inline styling and is blocked by CSP

Disable the style inyection on <head> to avoid CSP errors, I'll add those three rules to pagure itself

Looks fine to me with one question: how much are we diverging from upstream's code with this?
Is this something we could work on with upstream to fix/improve?

Well, the line number thinks is already quite diverged from upstream so all the modifications that involve that part are diverged :)

On this part, here the big problem is CSP. upstream builts their css class from some constants, and them inject css attributes to those classes dynamically. The idea is great on pre-csp world, they can adjust the css classes of the line numbers just touching the constant, but is a nightmare for CSP denying inline styling since there is no a proper and secure way to instert those css rules on the DOM without being blocked by CSP, or I didn't found any at least.

Anyhow, the rest of the functionality remains intact, this patch just removes the unsafe css injections in favour of moving the same css rules to jinga2

:thumbsup: for me then :)

Pull-Request has been merged by jlanda

4 years ago