ngxPlaidLink button directive does not respect disabled html property

[trentprynn]

When using [email protected] with [email protected] thengxPlaidLink directive on a html <button> adding disabled to the button does not disable the button and the button can still be clicked and plaid link will open.

Here is a stackblitz that shows the reproduction https://stackblitz.com/edit/angular-webcontainer-template-nzh3r7?devtoolsheight=33&file=src/app/app.component.html

To view bug in stackblitz do the following

1. Open link in CHROME (only chrome supported)
2. Allow dependencies to install
3. Type yarn start into console that pops up
4. View angular project on right
5. Click on link bank account button and observe plaid link popup even though button has disabled set in html

I'll work on getting a fix submitted for this but I wanted to add an issue to track it

[trentprynn]

I see what's going on

in the directive it's disabling the button itself with this.disabledButton = true; until plaid is initialized, then re-enabling it. Probably need to add a disabled input value from parent and then use an || for button is disabled by plaid loading or by user

[mike-roberts]

Probably need to add a disabled input value from parent and then use an || for button is disabled by plaid loading or by user

This doesn't seem to work unfortunately, unless I'm just doing something totally wrong which could be the case 🤣 .

If you're trying to do this to handle the link token scenario, that's not really going to work anyway because the button will still be rendered but won't have a token yet. I've been getting around this by using an *ngIf to render a loading indicator until the link token is returned to the app from backend, and then rendering the button with the directive once I have the token.

You could also use that *ngIf to render a disabled button without the directive and swap out to the button with the directive once you get a token. I'll be updating the readme in the PR for v14.0.0 to account for this scenario.