Merge pull request #990 from plotly/visibility-inherit

Try out visibility:inherit default for text
plotly · Oct 12, 2016 · f7a8afa · f7a8afa
2 parents 0109c9b + f9cc14c
commit f7a8afa
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 2 deletions.
diff --git a/src/lib/svg_text_utils.js b/src/lib/svg_text_utils.js
@@ -91,7 +91,7 @@ exports.convertToTspans = function(_context, _callback) {
         }
         _context.text('')
             .style({
-                visibility: 'visible',
+                visibility: 'inherit',
                 'white-space': 'pre'
             });
 

diff --git a/src/snapshot/tosvg.js b/src/snapshot/tosvg.js
@@ -71,12 +71,19 @@ module.exports = function toSVG(gd, format) {
     svg.selectAll('text')
         .attr('data-unformatted', null)
         .each(function() {
-            // hidden text is pre-formatting mathjax, the browser ignores it but it can still confuse batik
             var txt = d3.select(this);
+
+            // hidden text is pre-formatting mathjax,
+            // the browser ignores it but it can still confuse batik
             if(txt.style('visibility') === 'hidden') {
                 txt.remove();
                 return;
             }
+            else {
+                // force other visibility value to export as visible
+                // to not potentially confuse non-browser SVG implementations
+                txt.style('visibility', 'visible');
+            }
 
             // Font family styles break things because of quotation marks,
             // so we must remove them *after* the SVG DOM has been serialized

diff --git a/test/jasmine/tests/snapshot_test.js b/test/jasmine/tests/snapshot_test.js
@@ -1,6 +1,9 @@
 var Plotly = require('@lib/index');
+
+var d3 = require('d3');
 var createGraphDiv = require('../assets/create_graph_div');
 var destroyGraphDiv = require('../assets/destroy_graph_div');
+
 var subplotMock = require('../../image/mocks/multiple_subplots.json');
 var annotationMock = require('../../image/mocks/annotations.json');
 
@@ -181,5 +184,28 @@ describe('Plotly.Snapshot', function() {
                 expect(svgElements.length).toBe(1);
             }).then(done);
         });
+
+        it('should force *visibility: visible* for text elements with *visibility: inherit*', function(done) {
+            d3.select(gd).style('visibility', 'inherit');
+
+            Plotly.plot(gd, subplotMock.data, subplotMock.layout).then(function() {
+
+                d3.select(gd).selectAll('text').each(function() {
+                    expect(d3.select(this).style('visibility')).toEqual('visible');
+                });
+
+                return Plotly.Snapshot.toSVG(gd);
+            })
+            .then(function(svg) {
+                var svgDOM = parser.parseFromString(svg, 'image/svg+xml'),
+                    textElements = svgDOM.getElementsByTagName('text');
+
+                for(var i = 0; i < textElements.length; i++) {
+                    expect(textElements[i].style.visibility).toEqual('visible');
+                }
+
+                done();
+            });
+        });
     });
 });