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

Addon-docs/Angular: Fix default values in ArgsTable #15881

Merged
merged 13 commits into from
Sep 1, 2021

Conversation

dexster
Copy link
Contributor

@dexster dexster commented Aug 19, 2021

Issue:

What I did

Added defaultValue to table.defaultValue.summary as per @shilman comments in #12644.

Also, added support for JSDoc @default and @DefaultValue to allow scenarios like accessor defaults where Compodoc will not find default values

How to test

Kitchen sink app has been updated to show defaultValues and also new accessor defaultValues

@nx-cloud
Copy link

nx-cloud bot commented Aug 19, 2021

Nx Cloud Report

CI ran the following commands for commit a2d0754. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

Status Command
#000000 nx run-many --target=prepare --all --parallel --max-parallel=15

Sent with 💌 from NxCloud.

Copy link
Member

@shilman shilman left a comment

Choose a reason for hiding this comment

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

Thanks for the fix @dexster! 🙏 What do you think about this?

@@ -157,7 +158,17 @@ export const extractType = (property: Property, defaultValue: any) => {
const extractDefaultValue = (property: Property) => {
try {
// eslint-disable-next-line no-eval
const value = eval(property.defaultValue);
let value = eval(property.defaultValue);
Copy link
Member

Choose a reason for hiding this comment

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

Can we just use the string for this and not eval anything? Eval was necessary when we needed the actual value, but it is a security risk and error prone, so it would be great if we could just skip it now that we only need a string.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Definitely. I only left the eval in as I was not sure about backwards compatibility and what might break if removed.

Copy link

@amaino amaino Feb 4, 2022

Choose a reason for hiding this comment

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

Hi @shilman and @dexster
Removing the eval has made all default values into strings for the component when using docs as these are set on the component when the story is loaded. I have created a PR to readd this but not sure if there is a better solution?

#17353

@dexster
Copy link
Contributor Author

dexster commented Aug 23, 2021

@shilman, eval removed. Note that this change also adds defaults to Outputs, something like this - new EventEmitter<Event>(). Are there any concerns regarding this?

if (value == null && property.jsdoctags.length > 0) {
property.jsdoctags.forEach((tag: JsDocTag) => {
if (['default', 'defaultvalue'].includes(tag.tagName.escapedText)) {
const tmp = window.document.createElement('DIV');
Copy link
Member

Choose a reason for hiding this comment

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

Is this just to unescape HTML? If so, is there a library we can use for this?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I originally used DOMParser code below but husky pre-commit throws this error - 'DOMParser' is not defined.

const dom = new DOMParser().parseFromString(tag.comment, 'text/html');
value = dom.body.textContent;

If I use window.DOMParser then Typescript has errors. If I add // @ts-ignore then all is well. WDYT?

 // @ts-ignore
const dom = new window.DOMParser().parseFromString(tag.comment, 'text/html');
value = dom.body.textContent;

Copy link
Member

Choose a reason for hiding this comment

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

i like this better if it works 😁

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@shilman It's been done. Can we merge?

@shilman
Copy link
Member

shilman commented Aug 31, 2021

@dexster sorry for the slow reply on this. CI is failing --- are you able to see the failures? any idea what's going on?

@shilman
Copy link
Member

shilman commented Aug 31, 2021

Looks like the user arg is being incorrectly set in the Angular11 e2e test:

Mouse_Highlight_Overlay

Copy link
Member

@shilman shilman left a comment

Choose a reason for hiding this comment

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

Looking great! Thanks for your persistence on this! 🙏

@shilman shilman changed the title Angular: Fix defaultvalues in docs Addon-docs/Angular: Fix defaultvalues in ArgsTable Sep 1, 2021
@shilman shilman changed the title Addon-docs/Angular: Fix defaultvalues in ArgsTable Addon-docs/Angular: Fix default values in ArgsTable Sep 1, 2021
@shilman shilman merged commit adbc3be into storybookjs:next Sep 1, 2021
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.

3 participants