From b7f619a4e787aca89a70857f9be920f67c8cd669 Mon Sep 17 00:00:00 2001 From: The Nguyen <6950941+treoden@users.noreply.github.com> Date: Tue, 26 Sep 2023 13:33:48 +0700 Subject: [PATCH 1/7] Improve the graphql validation error debuging --- .../[buildQuery]graphql[notification].js | 13 +++++++ .../services/graphqlErrorMessageFormat.js | 38 +++++++++++++++++++ 2 files changed, 51 insertions(+) create mode 100644 packages/evershop/src/modules/graphql/services/graphqlErrorMessageFormat.js diff --git a/packages/evershop/src/modules/graphql/pages/global/[buildQuery]graphql[notification].js b/packages/evershop/src/modules/graphql/pages/global/[buildQuery]graphql[notification].js index a616fd523..e6f8c0a02 100644 --- a/packages/evershop/src/modules/graphql/pages/global/[buildQuery]graphql[notification].js +++ b/packages/evershop/src/modules/graphql/pages/global/[buildQuery]graphql[notification].js @@ -2,8 +2,12 @@ const { execute } = require('graphql'); const { parse } = require('graphql'); const { validate } = require('graphql/validation'); const isDevelopmentMode = require('@evershop/evershop/src/lib/util/isDevelopmentMode'); +const { debug } = require('@evershop/evershop/src/lib/log/debuger'); let schema = require('../../services/buildSchema'); const { getContext } = require('../../services/contextHelper'); +const { + graphqlErrorMessageFormat +} = require('../../services/graphqlErrorMessageFormat'); module.exports = async function graphql(request, response, delegate, next) { // TODO: Should we wait for previous async middlewares? @@ -23,6 +27,15 @@ module.exports = async function graphql(request, response, delegate, next) { // Validate the query const validationErrors = validate(schema, document); if (validationErrors.length > 0) { + const formatedErrorMessage = graphqlErrorMessageFormat( + graphqlQuery, + validationErrors[0].locations[0].line, + validationErrors[0].locations[0].column + ); + debug( + 'critical', + `GraphQL validation error: ${formatedErrorMessage}` + ); next(validationErrors[0]); } else { if (isDevelopmentMode()) { diff --git a/packages/evershop/src/modules/graphql/services/graphqlErrorMessageFormat.js b/packages/evershop/src/modules/graphql/services/graphqlErrorMessageFormat.js new file mode 100644 index 000000000..25ca03543 --- /dev/null +++ b/packages/evershop/src/modules/graphql/services/graphqlErrorMessageFormat.js @@ -0,0 +1,38 @@ +module.exports.graphqlErrorMessageFormat = function graphqlErrorMessageFormat( + inputString, + lineNumber, + columnNumber +) { + if (!inputString) { + return ''; + } + const lines = inputString.split('\n'); + if (lineNumber <= 0 || lineNumber > lines.length) { + return 'Invalid line number'; + } + + const zeroBasedLineNumber = lineNumber - 1; + const line = lines[zeroBasedLineNumber]; + if (columnNumber <= 0 || columnNumber > line.length) { + return 'Invalid column number for the given line'; + } + const zeroBasedColumnNumber = columnNumber - 1; + const startIndex = zeroBasedColumnNumber; + let endIndex = line.indexOf(')', startIndex); + + if (endIndex === -1) { + endIndex = line.length; // If the special character is not found, highlight until the end of the line + } + + const ANSI_RESET = '\x1b[0m'; + const ANSI_HIGHLIGHT = '\x1b[33m'; + + // Apply highlighting to the text + const highlightedText = line.substring(startIndex, endIndex); + const highlightedLine = line.replace( + highlightedText, + `${ANSI_HIGHLIGHT}${highlightedText}${ANSI_RESET}` + ); + + return highlightedLine; +}; From a035b5ffa281a54a6a09148e25af29d3574a1cd3 Mon Sep 17 00:00:00 2001 From: The Nguyen <6950941+treoden@users.noreply.github.com> Date: Tue, 26 Sep 2023 13:51:50 +0700 Subject: [PATCH 2/7] Enable debug in development mode by default --- package.json | 1 - packages/evershop/src/lib/log/debuger.js | 68 ++++++++++++------------ 2 files changed, 35 insertions(+), 34 deletions(-) diff --git a/package.json b/package.json index c546d9fd4..3a4e865be 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,6 @@ ], "scripts": { "dev": "evershop dev", - "dev:debug": "evershop dev --debug", "setup": "evershop install", "build": "evershop build", "start": "evershop start", diff --git a/packages/evershop/src/lib/log/debuger.js b/packages/evershop/src/lib/log/debuger.js index 06a93e9da..248b8082c 100644 --- a/packages/evershop/src/lib/log/debuger.js +++ b/packages/evershop/src/lib/log/debuger.js @@ -1,43 +1,45 @@ const { green, red, blue, yellow, white } = require('kleur'); +const isDevelopmentMode = require('../util/isDevelopmentMode'); // Define logger function function debug(level, message) { - if (!process.argv.includes('--debug')) { - return; // Do not output message to console or file - } - let logMessage = ``; - let textMessage = `${message}`; - // If message is an exception object, include the stack trace - if (message instanceof Error) { - textMessage = `${message.message}\n${message.stack}`; - } - // Switch color based on level - switch (level) { - case 'critical': - logMessage += red(`[debug] ❌ ${textMessage}`); - break; - case 'warning': - logMessage += yellow(`[debug] ⚠️ ${textMessage}`); - break; - case 'info': - logMessage += blue(`[debug] ℹ️ ${textMessage}`); - break; - case 'success': - logMessage += green(`[debug] ✅ ${textMessage}`); - break; - default: - logMessage += white(`[debug] - ${textMessage}`); - break; - } + if (isDevelopmentMode() || process.argv.includes('--debug')) { + let logMessage = ``; + let textMessage = `${message}`; + // If message is an exception object, include the stack trace + if (message instanceof Error) { + textMessage = `${message.message}\n${message.stack}`; + } + // Switch color based on level + switch (level) { + case 'critical': + logMessage += red(`[debug] ❌ ${textMessage}`); + break; + case 'warning': + logMessage += yellow(`[debug] ⚠️ ${textMessage}`); + break; + case 'info': + logMessage += blue(`[debug] ℹ️ ${textMessage}`); + break; + case 'success': + logMessage += green(`[debug] ✅ ${textMessage}`); + break; + default: + logMessage += white(`[debug] - ${textMessage}`); + break; + } - // If message is added to a group, store it in the group - if (this.group && Array.isArray(this.group.messages)) { - this.group.messages.push(logMessage); + // If message is added to a group, store it in the group + if (this.group && Array.isArray(this.group.messages)) { + this.group.messages.push(logMessage); + return; // Do not output message to console or file + } + + // eslint-disable-next-line no-console + console.log(logMessage); + } else { return; // Do not output message to console or file } - - // eslint-disable-next-line no-console - console.log(logMessage); } function error(e) { From f485ce16857fb4e87ffbfb4209c61fa44c1ee9fb Mon Sep 17 00:00:00 2001 From: The Nguyen <6950941+treoden@users.noreply.github.com> Date: Tue, 26 Sep 2023 13:53:07 +0700 Subject: [PATCH 3/7] Enable debug in development mode by default --- packages/evershop/src/lib/log/debuger.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/evershop/src/lib/log/debuger.js b/packages/evershop/src/lib/log/debuger.js index 248b8082c..353c6c23f 100644 --- a/packages/evershop/src/lib/log/debuger.js +++ b/packages/evershop/src/lib/log/debuger.js @@ -38,7 +38,7 @@ function debug(level, message) { // eslint-disable-next-line no-console console.log(logMessage); } else { - return; // Do not output message to console or file + // Do not output message to console or file } } From 61c67ff18ecb43f55e2f13cc305512ca3f661a03 Mon Sep 17 00:00:00 2001 From: The Nguyen <6950941+treoden@users.noreply.github.com> Date: Tue, 26 Sep 2023 13:59:01 +0700 Subject: [PATCH 4/7] Fix Qty not updating properly #323 --- .../catalog/pages/frontStore/productView/Form.jsx | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/packages/evershop/src/modules/catalog/pages/frontStore/productView/Form.jsx b/packages/evershop/src/modules/catalog/pages/frontStore/productView/Form.jsx index 7454d8f24..deffc6452 100644 --- a/packages/evershop/src/modules/catalog/pages/frontStore/productView/Form.jsx +++ b/packages/evershop/src/modules/catalog/pages/frontStore/productView/Form.jsx @@ -50,10 +50,7 @@ function ToastMessage({ thumbnail, name, qty, count, cartUrl, toastId }) {
{name}
-
- Qty: - {qty} -
+
{_('QTY: ${qty}', { qty })}
@@ -92,7 +89,7 @@ function AddToCart({ stockAvaibility, loading = false, error }) { validationRules={['notEmpty']} className="qty" name="qty" - placeholder="Qty" + placeholder={_('Qty')} formId="productForm" /> @@ -113,7 +110,7 @@ function AddToCart({ stockAvaibility, loading = false, error }) { /> )} {stockAvaibility === false && ( -