Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(api): parses some of the data as [OBJECT OBJECT] #7280

Conversation

djabarovgeorge
Copy link
Contributor

@djabarovgeorge djabarovgeorge commented Dec 11, 2024

What changed? Why was the change needed?

this PR solves the issue that was raised, but there are still issues with the preview we will need to solve. i was not able to solve anything that was happening in PrepareAndValidateContentUsecase, because changing one issue caused another.

Note: This PR addresses all potential Liquid JS runtime errors during the preview process, based on the current Novu implementation, which supports basic Liquid JS output with filters.

Here is a summary i was able to do while working on this ticket:

  1. {{subscriber}}

    • No issue generated. Open issue
    • Preview: Displays {{subscriber}}.
      • SOLVED: Now replaced with text ([[Invalid Variable: ...]]).
  2. {{subscriber}} {{subscriber.firstName}}

  3. {{subscriber asd}}

    • Issue generated. As Expected
    • Preview: Empty (removed in the prepare... use case). Open issue
  4. {{payload..name | upcase}}

    • Issue generated. As Expected
    • Preview framework: Fails with BridgeRequestError: Workflow with id: asd-opyf has invalid controls syntax in step with id: in-app-step. Please correct step control syntax. (Liquid.js fails to parse invalid template output.)
      • SOLVED: Now replaced with text ([[Invalid Variable: ...]]).
  5. {{payload | upcase}}

    • Issue generated. As Expected
    • Preview: Displays [OBJECT OBJECT].
    • Why? This is valid Liquid.js output for the payload variable. In the pipeline, payload: {} is passed, and Liquid.js outputs {}.toString().
      - SOLVED: Now replaced with text ([[Invalid Variable: ...]]).
  6. {{payload.name ca}}

    • Issue generated. As Expected
    • Preview: Empty (removed in the prepare... use case). Open issue
  7. {{payload.name ca | upcase}}

    • Issue generated. As Expected
    • Preview: Empty (removed in the prepare... use case).
    • Why? This is valid Liquid.js output for the payload.name variable. Since the variable is not provided, it renders nothing.
      • SOLVED: Now replaced with text ([[Invalid Variable: ...]]).
  8. {{payload}} or {{payload adasds}}

    • Issue generated. As Expected
    • Preview: Empty (removed in the prepare... use case). Open issue

Example of before

image

After

image

Expand for optional sections

Related enterprise PR

Special notes for your reviewer

Copy link

linear bot commented Dec 11, 2024

Copy link

netlify bot commented Dec 11, 2024

Deploy Preview for dev-web-novu ready!

Name Link
🔨 Latest commit 96b03a2
🔍 Latest deploy log https://app.netlify.com/sites/dev-web-novu/deploys/675aa6d55b692f00087aa24b
😎 Deploy Preview https://deploy-preview-7280.dashboard.novu-staging.co
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Dec 11, 2024

Deploy Preview for dashboard-v2-novu-staging ready!

Name Link
🔨 Latest commit 96b03a2
🔍 Latest deploy log https://app.netlify.com/sites/dashboard-v2-novu-staging/deploys/675aa6d519c5790008b20669
😎 Deploy Preview https://deploy-preview-7280.dashboard-v2.novu-staging.co
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Comment on lines +32 to +33
const INVALID_VARIABLE_PLACEHOLDER = '<INVALID_VARIABLE_PLACEHOLDER>';
const PREVIEW_ERROR_MESSAGE_PLACEHOLDER = `[[Invalid Variable: ${INVALID_VARIABLE_PLACEHOLDER}]]`;
Copy link
Contributor Author

@djabarovgeorge djabarovgeorge Dec 11, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am open to error message suggestions :)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Now, the liquid parser is aware of the Novu-supported variables, and it passes it to its client.

Comment on lines +66 to +68
if (keys.length === 1) {
return;
}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this solves cases if user provides the following control value:
{{subscriber}} {{subscriber.firstName}}
in such case API would trow 500 TypeError: Cannot create property 'firstName' on string '{{subscriber}}'

@djabarovgeorge djabarovgeorge changed the title fear(api): wip refactor liquid parser fear(api): wip refactor liquid parser Dec 13, 2024
@djabarovgeorge djabarovgeorge changed the title fear(api): wip refactor liquid parser fix(api): parses some of the data as [OBJECT OBJECT] Dec 13, 2024
* we need to remove the '{{' and '}}' from the invalid variable name
* so that framework can parse it without errors
*/
const invalidVariableExpression = invalidVariable.name.replace('{{', '').replace('}}', '');
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

self note: need to replace all (the same) invalid outputs at once here.

Suggested change
const invalidVariableExpression = invalidVariable.name.replace('{{', '').replace('}}', '');
const invalidVariableExpression = invalidVariable.name.replaceAll('{{', '').replace('}}', '');

@djabarovgeorge
Copy link
Contributor Author

this progress was cherry-picked to #7303

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant