feature #14071 [VarDumper] Ctrl+click toggles-all and fix IE8 support (larsborn, nicolas-grekas)

This PR was merged into the 2.7 branch.

Discussion
----------

 	[VarDumper] Ctrl+click toggles-all and fix IE8 support

| Q             | A
| ------------- | ---
| Bug fix?      | yes
| New feature?  | yes
| BC breaks?    | no
| Deprecations? | no
| Tests pass?   | yes
| Fixed tickets | #12757, #12612
| License       | MIT
| Doc PR        | -

I choose Ctrl+click instead of the initial Alt+click because after testing both on Windows and Ubuntu, Alt+click is bound by the Browser/OS for other things. Ctrl+click is OK.

Commits
-------

70f1f24 [VarDumper] Ctrl+click toggles-all and fix IE8 support
12c1feb [VarDumper] implement expand all on ALT+click

src/Symfony/Component/VarDumper/Dumper/HtmlDumper.php

@@ -115,23 +115,52 @@ Sfdump = window.Sfdump || (function (doc) {
 
 var refStyle = doc.createElement('style'),
     rxEsc = /([.*+?^${}()|\[\]\/\\])/g,
-    idRx = /\bsf-dump-\d+-ref[012]\w+\b/;
+    idRx = /\bsf-dump-\d+-ref[012]\w+\b/,
+    addEventListener = function (e, n, cb) {
+        e.addEventListener(n, cb, false);
+    };
 
 doc.documentElement.firstChild.appendChild(refStyle);
 
-function toggle(a) {
-    var s = a.nextSibling || {};
+if (!doc.addEventListener) {
+    addEventListener = function (element, eventName, callback) {
+        element.attachEvent('on' + eventName, function (e) {
+            e.preventDefault = function () {e.returnValue = false;};
+            e.target = e.srcElement;
+            callback(e);
+        });
+    };
+}
 
-    if ('sf-dump-compact' == s.className) {
-        a.lastChild.innerHTML = '▼';
-        s.className = 'sf-dump-expanded';
-    } else if ('sf-dump-expanded' == s.className) {
-        a.lastChild.innerHTML = '▶';
-        s.className = 'sf-dump-compact';
+function toggle(a, recursive) {
+    var s = a.nextSibling || {}, oldClass = s.className, arrow, newClass;
+
+    if ('sf-dump-compact' == oldClass) {
+        arrow = '▼';
+        newClass = 'sf-dump-expanded';
+    } else if ('sf-dump-expanded' == oldClass) {
+        arrow = '▶';
+        newClass = 'sf-dump-compact';
     } else {
         return false;
     }
 
+    a.lastChild.innerHTML = arrow;
+    s.className = newClass;
+
+    if (recursive) {
+        try {
+            a = s.querySelectorAll('.'+oldClass);
+            for (s = 0; s < a.length; ++s) {
+                if (a[s].className !== newClass) {
+                    a[s].className = newClass;
+                    a[s].previousSibling.lastChild.innerHTML = arrow;
+                }
+            }
+        } catch (e) {
+        }
+    }
+
     return true;
 };
 
@@ -139,7 +168,7 @@ return function (root) {
     root = doc.getElementById(root);
 
     function a(e, f) {
-        root.addEventListener(e, function (e) {
+        addEventListener(root, e, function (e) {
             if ('A' == e.target.tagName) {
                 f(e.target, e);
             } else if ('A' == e.target.parentNode.tagName) {
@@ -147,20 +176,23 @@ return function (root) {
             }
         });
     };
-    root.addEventListener('mouseover', function (e) {
+    addEventListener(root, 'mouseover', function (e) {
         if ('' != refStyle.innerHTML) {
             refStyle.innerHTML = '';
         }
     });
     a('mouseover', function (a) {
         if (a = idRx.exec(a.className)) {
-            refStyle.innerHTML = 'pre.sf-dump .'+a[0]+'{background-color: #B729D9; color: #FFF !important; border-radius: 2px}';
+            try {
+                refStyle.innerHTML = 'pre.sf-dump .'+a[0]+'{background-color: #B729D9; color: #FFF !important; border-radius: 2px}';
+            } catch (e) {
+            }
         }
     });
     a('click', function (a, e) {
         if (/\bsf-dump-toggle\b/.test(a.className)) {
             e.preventDefault();
-            if (!toggle(a)) {
+            if (!toggle(a, e.ctrlKey)) {
                 var r = doc.getElementById(a.getAttribute('href').substr(1)),
                     s = r.previousSibling,
                     f = r.parentNode,
@@ -174,9 +206,19 @@ return function (root) {
                     r.innerHTML = r.innerHTML.replace(new RegExp('^'+f[0].replace(rxEsc, '\\$1'), 'mg'), t[0]);
                 }
                 if ('sf-dump-compact' == r.className) {
-                    toggle(s);
+                    toggle(s, e.ctrlKey);
                 }
             }
+
+            if (doc.getSelection) {
+                try {
+                    doc.getSelection().removeAllRanges();
+                } catch (e) {
+                    doc.getSelection().empty();
+                }
+            } else {
+                doc.selection.empty();
+            }
         }
     });
 
@@ -210,6 +252,7 @@ return function (root) {
             } else {
                 a.innerHTML += ' ';
             }
+            a.title = (a.title ? a.title+'\n' : '')+'[Ctrl+click] Expand all children';
             a.innerHTML += '<span>▼</span>';
             a.className += ' sf-dump-toggle';
             if ('sf-dump' != elt.parentNode.className) {