Uncaught Error: An "el" .issue-view .issue-container must exist in DOM

I’m developing a Jira Server Plugin and it contains a Web Panel module. When I define HTML in the .vm file , I got “Uncaught Error: An “el” .issue-view .issue-container must exist in DOM” error.
I google it, but I cannot find any useful answers.

Can anyone help me ?

1 Like

I am also facing the same issue. Did you figure out the solution?

Hi @PoojaShetty,
without any code example it is hard to know what exactly u want to achieve. But it sounds like your web panel’s code tries to manipulate elements during a page view transition or before the DOM is fully loaded.

What you can try is:

1. Modify Your Velocity Template

Ensure that your velocity template includes a unique id or class for your web panel:

<div id="my-web-panel">
    <!-- Your HTML content here -->
</div>

2. Update Your JavaScript

Use AJS to wait for the DOM elements to be available before running your script:
You can use the AJS.toInit()-Function to make sure all DOM elements are loaded completely before manipulating the elements.

AJS.toInit(function() {
    // Ensure the element exists before running your code
    if (AJS.$('#my-web-panel').length) {
        // Your code that depends on the DOM element
        // Example: Initialize your component
    }
});

3. Using Event Bindings

If your script needs to run after the issue view is rendered, you might use the NEW_CONTENT_ADDED event:

AJS.bind('jira:issue_updated, NEW_CONTENT_ADDED', function() {
    // Check if your element exists
    if (AJS.$('#my-web-panel').length) {
        // Your logic here
    }

Maybe it helps :slight_smile:
Cheers Daniel

Thanks for the response. My problem was that I used html tags within the .vm file.