diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7d070d92c2bda..7171009c3c8a2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1948,6 +1948,9 @@ importers: projects/packages/connection: dependencies: + '@automattic/jetpack-connection': + specifier: workspace:* + version: link:../../js-packages/connection '@automattic/jetpack-idc': specifier: workspace:* version: link:../../js-packages/idc diff --git a/projects/js-packages/webpack-config/changelog/update-load-connection-js-bundle-via-connection-package b/projects/js-packages/webpack-config/changelog/update-load-connection-js-bundle-via-connection-package new file mode 100644 index 0000000000000..34cd6f32680e5 --- /dev/null +++ b/projects/js-packages/webpack-config/changelog/update-load-connection-js-bundle-via-connection-package @@ -0,0 +1,4 @@ +Significance: minor +Type: changed + +Updated connection js to load its bundle via connection package diff --git a/projects/js-packages/webpack-config/src/webpack.js b/projects/js-packages/webpack-config/src/webpack.js index 7a925aa435d96..449c8f370e0a0 100644 --- a/projects/js-packages/webpack-config/src/webpack.js +++ b/projects/js-packages/webpack-config/src/webpack.js @@ -110,6 +110,10 @@ const defaultRequestMap = { external: 'JetpackScriptDataModule', handle: 'jetpack-script-data', }, + '@automattic/jetpack-connection': { + external: 'JetpackConnection', + handle: 'jetpack-connection', + }, }; const DependencyExtractionPlugin = ( { requestMap, ...options } = {} ) => { diff --git a/projects/packages/connection/changelog/update-load-connection-js-bundle-via-connection-package b/projects/packages/connection/changelog/update-load-connection-js-bundle-via-connection-package new file mode 100644 index 0000000000000..34cd6f32680e5 --- /dev/null +++ b/projects/packages/connection/changelog/update-load-connection-js-bundle-via-connection-package @@ -0,0 +1,4 @@ +Significance: minor +Type: changed + +Updated connection js to load its bundle via connection package diff --git a/projects/packages/connection/package.json b/projects/packages/connection/package.json index 4d22c790c9fd7..6331006f5635f 100644 --- a/projects/packages/connection/package.json +++ b/projects/packages/connection/package.json @@ -25,6 +25,7 @@ "watch": "pnpm run build && pnpm webpack watch" }, "dependencies": { + "@automattic/jetpack-connection": "workspace:*", "@automattic/jetpack-idc": "workspace:*", "@wordpress/data": "10.5.0", "@wordpress/element": "6.5.0" diff --git a/projects/packages/connection/src/class-connection-assets.php b/projects/packages/connection/src/class-connection-assets.php new file mode 100644 index 0000000000000..f231aa40b7b9e --- /dev/null +++ b/projects/packages/connection/src/class-connection-assets.php @@ -0,0 +1,41 @@ + true, + 'textdomain' => 'jetpack-connection', + ) + ); + } +} diff --git a/projects/packages/connection/src/class-manager.php b/projects/packages/connection/src/class-manager.php index f2ee31611d31d..41913b356e755 100644 --- a/projects/packages/connection/src/class-manager.php +++ b/projects/packages/connection/src/class-manager.php @@ -156,7 +156,7 @@ public static function configure() { // Initial Partner management. Partner::init(); - add_filter( 'jetpack_admin_js_script_data', array( Initial_State::class, 'set_connection_script_data' ), 10, 1 ); + Connection_Assets::configure(); } /** diff --git a/projects/packages/connection/src/js/jetpack-connection.js b/projects/packages/connection/src/js/jetpack-connection.js new file mode 100644 index 0000000000000..e50e4642d6a7b --- /dev/null +++ b/projects/packages/connection/src/js/jetpack-connection.js @@ -0,0 +1 @@ +export * from '@automattic/jetpack-connection'; diff --git a/projects/packages/connection/webpack.config.js b/projects/packages/connection/webpack.config.js index e451025a4fdd0..27f00aad5d8f1 100644 --- a/projects/packages/connection/webpack.config.js +++ b/projects/packages/connection/webpack.config.js @@ -16,8 +16,57 @@ for ( const file of glob.sync( './src/sso/*.css' ) ) { ssoEntries[ name ].push( path.resolve( file ) ); } +/** + * @type {import('webpack').Configuration[]} Webpack configuration. + */ +const sharedConfig = { + mode: jetpackWebpackConfig.mode, + devtool: jetpackWebpackConfig.devtool, + output: { + ...jetpackWebpackConfig.output, + path: path.resolve( './dist' ), + }, + optimization: { + ...jetpackWebpackConfig.optimization, + }, + resolve: { + ...jetpackWebpackConfig.resolve, + }, + node: false, + module: { + strictExportPresence: true, + rules: [ + // Transpile JavaScript, including node_modules. + jetpackWebpackConfig.TranspileRule(), + + // Transpile @automattic/jetpack-* in node_modules too. + jetpackWebpackConfig.TranspileRule( { + includeNodeModules: [ '@automattic/jetpack-' ], + } ), + + // Handle CSS. + jetpackWebpackConfig.CssRule( { + extensions: [ 'css', 'sass', 'scss' ], + extraLoaders: [ 'sass-loader' ], + } ), + // Handle images. + jetpackWebpackConfig.FileRule(), + ], + }, + externals: { + ...jetpackWebpackConfig.externals, + jetpackConfig: JSON.stringify( { + consumer_slug: 'connection_package', + } ), + }, +}; + +/** + * @type {import('webpack').Configuration[]} Webpack configuration. + */ module.exports = [ { + ...sharedConfig, entry: { 'tracks-ajax': './src/js/tracks-ajax.js', 'tracks-callables': { @@ -30,47 +79,33 @@ module.exports = [ 'identity-crisis': './src/identity-crisis/_inc/admin.jsx', ...ssoEntries, }, - mode: jetpackWebpackConfig.mode, - devtool: jetpackWebpackConfig.devtool, - output: { - ...jetpackWebpackConfig.output, - path: path.resolve( './dist' ), - }, - optimization: { - ...jetpackWebpackConfig.optimization, - }, - resolve: { - ...jetpackWebpackConfig.resolve, - }, - node: false, plugins: [ ...jetpackWebpackConfig.StandardPlugins( { MiniCssExtractPlugin: { filename: '[name].css' }, } ), ], - module: { - strictExportPresence: true, - rules: [ - // Transpile JavaScript, including node_modules. - jetpackWebpackConfig.TranspileRule(), - - // Transpile @automattic/jetpack-* in node_modules too. - jetpackWebpackConfig.TranspileRule( { - includeNodeModules: [ '@automattic/jetpack-' ], - } ), - - // Handle CSS. - jetpackWebpackConfig.CssRule( { - extensions: [ 'css', 'sass', 'scss' ], - extraLoaders: [ 'sass-loader' ], - } ), - ], + }, + { + ...sharedConfig, + entry: { + 'jetpack-connection': { + import: './src/js/jetpack-connection.js', + library: { + name: 'JetpackConnection', + type: 'umd', + }, + }, }, - externals: { - ...jetpackWebpackConfig.externals, - jetpackConfig: JSON.stringify( { - consumer_slug: 'identity_crisis', + plugins: [ + ...jetpackWebpackConfig.StandardPlugins( { + MiniCssExtractPlugin: { filename: '[name].css' }, + DependencyExtractionPlugin: { + requestMap: { + // We don't want to externalize this package, we rather want to bundle it. + '@automattic/jetpack-connection': {}, + }, + }, } ), - }, + ], }, ]; diff --git a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php index aaab346c71bb2..6da8bf5eeded5 100644 --- a/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php +++ b/projects/plugins/jetpack/_inc/lib/admin-pages/class.jetpack-admin-page.php @@ -175,7 +175,7 @@ public function admin_scripts() { public function admin_styles() { $min = ( defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ) ? '' : '.min'; - wp_enqueue_style( 'jetpack-admin', plugins_url( "css/jetpack-admin{$min}.css", JETPACK__PLUGIN_FILE ), array( 'genericons' ), JETPACK__VERSION . '-20121016' ); + wp_enqueue_style( 'jetpack-admin', plugins_url( "css/jetpack-admin{$min}.css", JETPACK__PLUGIN_FILE ), array( 'genericons', 'jetpack-connection' ), JETPACK__VERSION . '-20121016' ); wp_style_add_data( 'jetpack-admin', 'rtl', 'replace' ); wp_style_add_data( 'jetpack-admin', 'suffix', $min ); } diff --git a/projects/plugins/jetpack/changelog/update-load-connection-js-bundle-via-connection-package b/projects/plugins/jetpack/changelog/update-load-connection-js-bundle-via-connection-package new file mode 100644 index 0000000000000..314f0ad9ed2bd --- /dev/null +++ b/projects/plugins/jetpack/changelog/update-load-connection-js-bundle-via-connection-package @@ -0,0 +1,4 @@ +Significance: minor +Type: other + +Updated connection js to load its bundle via connection package diff --git a/projects/plugins/jetpack/tests/e2e/package.json b/projects/plugins/jetpack/tests/e2e/package.json index 7d7903ae847c4..5ef5ed5c030c1 100644 --- a/projects/plugins/jetpack/tests/e2e/package.json +++ b/projects/plugins/jetpack/tests/e2e/package.json @@ -13,7 +13,7 @@ "license": "GPL-2.0-or-later", "author": "Automattic", "scripts": { - "build": "pnpm jetpack build packages/forms packages/connection packages/blaze plugins/jetpack -v --no-pnpm-install --production", + "build": "pnpm jetpack build packages/forms packages/assets packages/connection packages/blaze plugins/jetpack -v --no-pnpm-install --production", "clean": "rm -rf output", "config:decrypt": "pnpm test-decrypt-default-config && pnpm test-decrypt-config", "distclean": "rm -rf node_modules", diff --git a/projects/plugins/search/changelog/update-load-connection-js-bundle-via-connection-package b/projects/plugins/search/changelog/update-load-connection-js-bundle-via-connection-package new file mode 100644 index 0000000000000..34cd6f32680e5 --- /dev/null +++ b/projects/plugins/search/changelog/update-load-connection-js-bundle-via-connection-package @@ -0,0 +1,4 @@ +Significance: minor +Type: changed + +Updated connection js to load its bundle via connection package diff --git a/projects/plugins/search/tests/e2e/package.json b/projects/plugins/search/tests/e2e/package.json index 16c55b15704ba..c289436e0db42 100644 --- a/projects/plugins/search/tests/e2e/package.json +++ b/projects/plugins/search/tests/e2e/package.json @@ -10,7 +10,7 @@ "license": "GPL-2.0-or-later", "author": "Automattic", "scripts": { - "build": "pnpm jetpack build packages/search plugins/jetpack -v --no-pnpm-install --production", + "build": "pnpm jetpack build packages/assets packages/search packages/connection plugins/jetpack -v --no-pnpm-install --production", "clean": "rm -rf output", "config:decrypt": "openssl enc -md sha1 -aes-256-cbc -d -pass env:CONFIG_KEY -in ./node_modules/jetpack-e2e-commons/config/encrypted.enc -out ./config/local.cjs", "distclean": "rm -rf node_modules", diff --git a/projects/plugins/social/changelog/update-load-connection-js-bundle-via-connection-package b/projects/plugins/social/changelog/update-load-connection-js-bundle-via-connection-package new file mode 100644 index 0000000000000..34cd6f32680e5 --- /dev/null +++ b/projects/plugins/social/changelog/update-load-connection-js-bundle-via-connection-package @@ -0,0 +1,4 @@ +Significance: minor +Type: changed + +Updated connection js to load its bundle via connection package diff --git a/projects/plugins/social/tests/e2e/package.json b/projects/plugins/social/tests/e2e/package.json index 133e529f3b534..dd164c8273870 100644 --- a/projects/plugins/social/tests/e2e/package.json +++ b/projects/plugins/social/tests/e2e/package.json @@ -14,7 +14,7 @@ "license": "GPL-2.0-or-later", "author": "Automattic", "scripts": { - "build": "pnpm jetpack build packages/assets plugins/social plugins/jetpack -v --no-pnpm-install --production", + "build": "pnpm jetpack build packages/assets packages/connection plugins/social plugins/jetpack -v --no-pnpm-install --production", "clean": "rm -rf output", "config:decrypt": "openssl enc -md sha1 -aes-256-cbc -d -pass env:CONFIG_KEY -in ./node_modules/jetpack-e2e-commons/config/encrypted.enc -out ./config/local.cjs", "distclean": "rm -rf node_modules",