[BUG] Cannot read property 'focus' of undefined on modal close
See original GitHub issueI’m submitting a …
[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, post on Stackoverflow or Gitter
Current behavior Whenever i open the modal and close it, the modal gets closed but i get an exception in the console saying
TypeError: Cannot read property 'focus' of undefined
at ngx-smart-modal.js:1128
at ZoneDelegate.invokeTask (zone.js:431)
at Object.onInvokeTask (core.js:26247)
at ZoneDelegate.invokeTask (zone.js:430)
at Zone.runTask (zone.js:198)
at ZoneTask.invokeTask (zone.js:513)
at ZoneTask.invoke (zone.js:502)
at timer (zone.js:3041)
Expected behavior There should be no exception thrown.
Reproduction of the problem My config for the modal is as follows :
<ngx-smart-modal
#imageGallery
identifier="imageGallery"
customClass="nsm-dialog-animation-fade"
class="imageGallery"
(onOpen)="log('Modal opened!')"
(onClose)="log('Modal closed!')"
(onDismiss)="log('Modal dismissed!')"
(onAnyCloseEvent)="modalClosed()"
[dismissable]="false"
[escapable]="false"
[hideDelay]="100"
>
<!-- Rest of the code -->
</ngx-smart-modal>
Steps to reporduce:
- Configure the modal with the above options.
- Open the modal.
- Close the modal. We can notice the exception thrown in console.
What is the motivation / use case for changing the behavior? N/A
Please tell us about your environment: OS: Win 10 Node: v10.16.0 Angular: 8.2
-
Smart Modal version: 7.3.0
-
Angular version: 8.2
-
Browser: [all ]
-
Language: [all ]
Issue Analytics
- State:
- Created 4 years ago
- Reactions:3
- Comments:12 (1 by maintainers)
Top Results From Across the Web
Cannot read property 'focus' of undefined in VUE When setting ...
Cannot read property 'focus' of undefined. This only happens for the else part of my method function . For this specific issue is...
Read more >Modal dialog not closing properly if initialized in different ...
Modal dialog not closing properly if initialized in different container then the grid itself with "Cannot read property 'focus' of undefined" | ...
Read more >Modal - Bootstrap
Use Bootstrap's JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.
Read more >How to set focus to input element in modal dialog
I guess this is caused by the following constellation: The ViewChild is injected at component creation, but since the input element is intially...
Read more >react-modal documentation
We seek to keep the focus on accessibility while providing a functional, ... This attribute when set as `null` doesn't add any class...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I ran across the same issue and I was calling
ngxModalService.open('modalName')
. When I changed it tongxModalService.getModal('modalName').open()
, the error didn’t happen again.if you dont need to focus on native element after modal close, set “refocus” option to false to avoid this error. its work for me