Merge pull request #7563 from plotly/fix-missing-json-font-attrs

Fix issue causing empty ScatterGL plots when using text elements

Author: emilykl

draftlogs/7563_fix.md

@@ -0,0 +1 @@
+ - Fix issue causing empty ScatterGL plots when using text elements [#7563](https://github.com/plotly/plotly.js/pull/7563)

package-lock.json

@@ -133,7 +133,6 @@
     "deep-equal": "^2.2.3",
     "ecstatic": "^4.1.4",
     "esbuild": "^0.25.5",
-    "esbuild-plugin-browserify-adapter": "^0.1.4",
     "esbuild-plugin-environment": "^0.4.0",
     "esbuild-plugin-glsl": "^1.2.2",
     "esbuild-plugin-inline-css": "^0.0.1",
@@ -182,4 +181,4 @@
       "acorn": "^8.1.1"
     }
   }
-}
+}

package.json

@@ -19,15 +19,13 @@ var tasks = [];
 // Bundle plotly.js
 tasks.push(function(done) {
     _bundle(constants.pathToPlotlyIndex, constants.pathToPlotlyBuild, {
-        noCompressAttributes: true,
     }, done)
 });
 
 // Bundle plotly.min.js
 tasks.push(function(done) {
     _bundle(constants.pathToPlotlyIndex, constants.pathToPlotlyBuildMin, {
         minify: true,
-        noCompressAttributes: true,
     }, done)
 });
 

tasks/cibundle.mjs

@@ -1,7 +1,7 @@
-var through = require('through2');
+const fs = require('fs');
 
 /**
- * Browserify transform that strips meta attributes out
+ * ESBuild plugin that strips out meta attributes
  * of the plotly.js bundles
  */
 
@@ -10,47 +10,46 @@ var OPTIONAL_COMMA = ',?';
 
 // one line string with or without trailing comma
 function makeStringRegex(attr) {
-    return makeRegex(
-        WHITESPACE_BEFORE + attr + ': \'.*\'' + OPTIONAL_COMMA
-    );
+    return makeRegex(WHITESPACE_BEFORE + attr + ": '.*'" + OPTIONAL_COMMA);
 }
 
 // joined array of strings with or without trailing comma
 function makeJoinedArrayRegex(attr) {
-    return makeRegex(
-        WHITESPACE_BEFORE + attr + ': \\[[\\s\\S]*?\\]' + '\\.join\\(.*' + OPTIONAL_COMMA
-    );
+    return makeRegex(WHITESPACE_BEFORE + attr + ': \\[[\\s\\S]*?\\]' + '\\.join\\(.*' + OPTIONAL_COMMA);
 }
 
 // array with or without trailing comma
 function makeArrayRegex(attr) {
-    return makeRegex(
-        WHITESPACE_BEFORE + attr + ': \\[[\\s\\S]*?\\]' + OPTIONAL_COMMA
-    );
+    return makeRegex(WHITESPACE_BEFORE + attr + ': \\[[\\s\\S]*?\\]' + OPTIONAL_COMMA);
 }
 
 function makeRegex(regexStr) {
-    return (
-        new RegExp(regexStr, 'g')
-    );
+    return new RegExp(regexStr, 'g');
 }
 
-module.exports = function() {
-    var allChunks = [];
-    return through(function(chunk, enc, next) {
-        allChunks.push(chunk);
-        next();
-    }, function(done) {
-        var str = Buffer.concat(allChunks).toString('utf-8');
-        this.push(
-            str
-                .replace(makeStringRegex('description'), '')
-                .replace(makeJoinedArrayRegex('description'), '')
-                .replace(makeArrayRegex('requiredOpts'), '')
-                .replace(makeArrayRegex('otherOpts'), '')
-                .replace(makeStringRegex('role'), '')
-                .replace(makeStringRegex('hrName'), '')
-        );
-        done();
-    });
+const allRegexes = [
+    makeStringRegex('description'),
+    makeJoinedArrayRegex('description'),
+    makeArrayRegex('requiredOpts'),
+    makeArrayRegex('otherOpts'),
+    makeStringRegex('role'),
+    makeStringRegex('hrName')
+];
+
+const esbuildPluginStripMeta = {
+    name: 'strip-meta-attributes',
+    setup(build) {
+        const loader = 'js';
+        build.onLoad({ filter: /\.js$/ }, async (file) => ({
+            contents: await fs.promises.readFile(file.path, 'utf-8').then((c) => {
+                allRegexes.forEach((r) => {
+                    c = c.replace(r, '');
+                });
+                return c;
+            }),
+            loader
+        }));
+    }
 };
+
+module.exports = esbuildPluginStripMeta;

tasks/compress_attributes.js

@@ -5,9 +5,8 @@ import prependFile from 'prepend-file';
 import { build } from 'esbuild';
 
 import esbuildConfig from '../../esbuild-config.js';
-import browserifyAdapter from 'esbuild-plugin-browserify-adapter';
+import esbuildPluginStripMeta from '../../tasks/compress_attributes.js';
 
-import transform from '../../tasks/compress_attributes.js';
 import common from './common.js';
 
 var basePlugins = esbuildConfig.plugins;
@@ -30,14 +29,14 @@ var basePlugins = esbuildConfig.plugins;
 export default async function _bundle(pathToIndex, pathToBundle, opts, cb) {
     opts = opts || {};
 
-    var config = {...esbuildConfig};
+    var config = { ...esbuildConfig };
 
     config.entryPoints = [pathToIndex];
     config.outfile = pathToBundle;
     config.minify = !!opts.minify;
 
     if(!opts.noCompressAttributes) {
-        config.plugins = basePlugins.concat([browserifyAdapter(transform)]);
+        config.plugins = basePlugins.concat([esbuildPluginStripMeta]);
     }
 
     if(opts.noPlugins) config.plugins = [];
@@ -51,7 +50,7 @@ export default async function _bundle(pathToIndex, pathToBundle, opts, cb) {
 
 // Until https://github.com/evanw/esbuild/pull/513 is merged
 // Thanks to https://github.com/prantlf and https://github.com/birkskyum
-function addWrapper(path){
+function addWrapper(path) {
     prependFile.sync(
         path,
         [

tasks/util/bundle_wrapper.mjs

@@ -36,8 +36,10 @@
    "marker": {
     "size": 20
    },
+   "text": ["orange"],
+   "textposition": "top center",
    "type": "scattergl",
-   "mode": "markers"
+   "mode": "text+markers"
   }
  ],
  "layout": {