Feat: Output faust version in dev|build|start commands. (#1874)

* Feat: Output faust version in dev|build|start commands.

* Lint: Fix eslint issue

* Acceptance Tests: update preview button selectos for WP 6.5

* Acceptance Tests: Attempt to fix preview tests

* Acceptance Test: Use correct variables

* Acceptance Test: Fix cpt_name var

* Acceptance Test: Remove click event

* Acceptance Test: Attempt to close welcome modals.

* Acceptance Test: Revert last commit

* Acceptance Test: Update DEVELOPMENT.md

* Acceptance Test: Click Welcome modal if present

* Acceptance Test: Pin e2e tests to WP 6.4

.changeset/shaggy-carpets-bow.md

@@ -0,0 +1,15 @@
+---
+'@faustwp/cli': patch
+---
+
+Faust CLI now outputs version number when running dev|build|start commands.
+
+When running those commands it will print the current Faust core and cli versions in the console:
+
+```bash
+% npm run dev -w examples/next/faustwp-getting-started
+info - Faust.js v3.0.1
+info - Faust.js CLI v3.0.1
+ready - started server on 0.0.0.0:3000, url: http://localhost:3000
+...
+```

DEVELOPMENT.md

@@ -133,14 +133,15 @@ FAUST_SECRET_KEY=00000000-0000-4000-8000-000000000001
 ### 3. WordPress Setup
 
 1. Leave the node server running and open a new shell.
-1. Move into the FaustWP plugin directory `plugins/faustwp`.
-1. Run `composer install` if you haven't already.
-1. Prepare a test WordPress site.
+2. Move into the FaustWP plugin directory `plugins/faustwp`.
+3. Run `composer install` if you haven't already.
+4. Prepare a test WordPress site.
    1. Run `docker-compose up -d --build`. If building for the first time, it could take some time to download and build the images.
-   1. Run `docker exec --workdir=/var/www/html/wp-content/plugins/faustwp $(docker-compose ps -q wordpress) wp plugin install wp-graphql --activate --allow-root`
-   1. Run `docker exec --workdir=/var/www/html/wp-content/plugins/faustwp $(docker-compose ps -q wordpress) wp db export tests/_data/dump.sql --allow-root`
-1. Copy `.env.testing.example` to `.env.testing`.
-1. Run `vendor/bin/codecept run acceptance` to start the end-2-end tests.
+   2. Run `docker exec --workdir=/var/www/html/wp-content/plugins/faustwp $(docker-compose ps -q wordpress) wp plugin install wp-graphql --activate --allow-root`
+   3. Run `docker exec --workdir=/var/www/html/wp-content/plugins/faustwp $(docker-compose ps -q wordpress) wp core update-db --allow-root `
+   4. Run `docker exec --workdir=/var/www/html/wp-content/plugins/faustwp $(docker-compose ps -q wordpress) wp db export tests/_data/dump.sql --allow-root`
+5. Copy `.env.testing.example` to `.env.testing`.
+6. Run `vendor/bin/codecept run acceptance` to start the end-2-end tests.
 
 ### Browser testing documentation
 
@@ -207,21 +208,21 @@ Once deployed, the updated packages and plugin will be visible here:
 - https://www.npmjs.com/package/@faustwp/blocks
 - https://plugins.trac.wordpress.org/browser/faustwp/tags
 
-
 ### Working with the Monorepo
+
 This section offers guidance for developers working within the monorepo environment, which utilizes npm for package management.
 
 #### Navigation:
 
-* Use your terminal or IDE to navigate the file structure.
-* To locate a specific project, navigate to its directory within the packages folder. For example, `cd packages/faustwp-core` would take you to the `faustwp-core` project directory.
+- Use your terminal or IDE to navigate the file structure.
+- To locate a specific project, navigate to its directory within the packages folder. For example, `cd packages/faustwp-core` would take you to the `faustwp-core` project directory.
 
 #### Building and Deploying:
 
-* We use npm for managing dependencies and running build scripts.
-* Individual projects often have their own package.json file with project-specific scripts for building and deploying. You can run these scripts using commands like `npm run build` or `npm run test` within the project directory (e.g., `packages/faustwp-core`).
-* Refer to the project's README file or internal documentation for specific build and deploy instructions.
-For deploying the entire monorepo, there might be a top-level build script which you can invoke with `npm run build`.
+- We use npm for managing dependencies and running build scripts.
+- Individual projects often have their own package.json file with project-specific scripts for building and deploying. You can run these scripts using commands like `npm run build` or `npm run test` within the project directory (e.g., `packages/faustwp-core`).
+- Refer to the project's README file or internal documentation for specific build and deploy instructions.
+  For deploying the entire monorepo, there might be a top-level build script which you can invoke with `npm run build`.
 
 #### Additional Considerations:
 
@@ -230,5 +231,5 @@ Use the `--workspaces` or `-w` flag to run a specific script command of a specif
 ```bash
 $ npm run build -w examples/next/faustwp-getting-started
 ```
-It runs the `build` npm script for the `faustwp-getting-started` example project.
 
+It runs the `build` npm script for the `faustwp-getting-started` example project.

packages/faustwp-cli/src/index.ts

@@ -11,6 +11,7 @@ import {
   getNextCliArgs,
   getWpSecret,
   isDebug,
+  printFaustVersion,
 } from './utils/index.js';
 import { marshallTelemetryData, sendTelemetryData } from './telemetry/index.js';
 
@@ -81,6 +82,8 @@ import { marshallTelemetryData, sendTelemetryData } from './telemetry/index.js';
     }
   }
 
+  printFaustVersion();
+
   /**
    * Spawn a child process using the args captured in argv and continue the
    * standard i/o for the Next.js CLI.

packages/faustwp-cli/src/telemetry/marshallTelemetryData.ts

@@ -1,5 +1,6 @@
 import fs from 'fs';
 import { getCliArgs } from '../utils/index.js';
+import { sanitizePackageJsonVersion } from '../utils/printFaustVersion.js';
 
 export interface TelemetryData {
   node_faustwp_core_version?: string;
@@ -14,34 +15,6 @@ export interface TelemetryData {
   command?: string;
 }
 
-/**
- * Sanitizes the version from a dependency in package.json.
- *
- * @param version The dependency version.
- * @returns A sanitized version or undefined if the version is a path.
- */
-const sanitizePackageJsonVersion = (_version: string | undefined) => {
-  let version = _version;
-
-  if (!version) {
-    return undefined;
-  }
-
-  if (version.charAt(0) === '^' || version.charAt(0) === '~') {
-    version = version.substring(1);
-  }
-
-  /**
-   * If a dependency is a file path set the value to undefined as we
-   * don't want to collect file paths in telemetry
-   */
-  if (version.startsWith('file:')) {
-    version = undefined;
-  }
-
-  return version;
-};
-
 /**
  * Marshall the JS telemetry data.
  * @param command Command that initiated the request

packages/faustwp-cli/src/utils/index.ts

@@ -5,3 +5,4 @@ export { getWpSecret } from './getWpSecret.js';
 export { getWpUrl } from './getWpUrl.js';
 export { getGraphqlEndpoint } from './getGraphqlEndpoint.js';
 export { hasYarn } from './hasYarn.js';
+export { printFaustVersion } from './printFaustVersion.js';

packages/faustwp-cli/src/utils/printFaustVersion.ts

@@ -0,0 +1,43 @@
+import fs from 'fs';
+import { infoLog } from '../stdout/index.js';
+
+/**
+ * Sanitizes the version from a dependency in package.json.
+ *
+ * @param version The dependency version.
+ * @returns A sanitized version or undefined if the version is a path.
+ */
+export function sanitizePackageJsonVersion(_version: string | undefined) {
+  let version = _version;
+
+  if (!version) {
+    return undefined;
+  }
+
+  if (version.charAt(0) === '^' || version.charAt(0) === '~') {
+    version = version.substring(1);
+  }
+
+  /**
+   * If a dependency is a file path set the value to undefined as we
+   * don't want to collect file paths in telemetry
+   */
+  if (version.startsWith('file:')) {
+    version = undefined;
+  }
+
+  return version;
+}
+
+export function printFaustVersion(): void {
+  const packageJson = JSON.parse(fs.readFileSync('package.json', 'utf8'));
+  const coreVersion = sanitizePackageJsonVersion(
+    packageJson?.dependencies?.['@faustwp/core'] as string | undefined,
+  );
+  const cliVersion = sanitizePackageJsonVersion(
+    packageJson?.dependencies?.['@faustwp/cli'] as string | undefined,
+  );
+  // eslint-disable-next-line
+  infoLog(`Faust.js v${coreVersion || 'unknown'}`);
+  infoLog(`Faust.js CLI v${cliVersion || 'unknown'}`);
+}

plugins/faustwp/.docker/Dockerfile

@@ -1,4 +1,4 @@
-ARG WP_VERSION=latest
+ARG WP_VERSION=6.4
 
 FROM wordpress:${WP_VERSION}