Jenkins test harness not loading JS files in dependencies of plugin under test

[Ullrich Hafner]

I’m trying to write UI tests with Jenkins test harness (based on HTMLUnit). When one of my jelly files under test uses a JS library that is part of another plugin (i.e. in a maven dependency) then the JS file seems to be not exposed and Jenkins reports a 404. The same jelly file works fine when deployed to a real Jenkins instance.  

Is this a known limitation of the test harness? Or is this a bug I can try to fix in the test harness (or is this the epic in https://issues.jenkins-ci.org/browse/JENKINS-41827)? 

Or do I need to bundle or reference the dependencies in a different way? 

My Jelly looks like:

<l:main-panel>

  <st:adjunct includes="io.jenkins.plugins.bootstrap4"/>
  <st:adjunct includes="io.jenkins.plugins.data-tables"/>
  <st:adjunct includes="io.jenkins.plugins.font-awesome"/>

  <div class="fluid-container">

    <h3>${it.displayName}</h3>

    <div class="row py-3">

      <div class="col">
        <div id="statistics">
          <bs:card title="${%Details}" fontAwesomeIcon="fa-chart-bar">
            <dt:table model="${it.getTableModel('forensics')}"/>
          </bs:card>
        </div>
      </div>

    </div>

  </div>

</l:main-panel>

The JS files are located in the webjars folder of the dependencies (not part of the WEB-INF/lib jar file anymore). They are resolved to something like

http://localhost:57434/plugin/jquery3-api/webjars/jquery.min.js  

and so on. 

In a real Jenkins instance the same URL will return the JS file, in the tests a 404.

(Full code is available in https://github.com/jenkinsci/forensics-api-plugin/pull/59)

[Jesse Glick]

On Wed, Nov 20, 2019 at 5:37 PM Ullrich Hafner <ullrich...@gmail.com> wrote:
> Is this a known limitation of the test harness? Or is this a bug I can try to fix in the test harness

Since you are probably the first to encounter the issue, I would guess
it is a bug. Whether it is fixable, I have no idea offhand.

[Ullrich Hafner]

Ok, I found the problem (but still have no solution on how to proceed):

In the adjunct jelly file I load the JS files in using commands like:

<script type="text/javascript" src="${resURL}/plugin/jquery3-api/webjars/jquery.min.js“/>

The part ${resURL} is correctly evaluated in Jenkins but not in the test harness (where „jenkins“ is used as context root). Actually ${resURL} is empty in the adjunct. So I think if Jenkins will use a different context root it will not work there as well.

Then I realized that other adjuncts use something like:

<script src="${it.packageUrl}/timeline_js/timeline-bundle.js" type="text/javascript" />

After changing that in my plugins the path is correctly expanded to something like

http://localhost:8080/adjuncts/3e890174/io/jenkins/plugins/bootstrap4/js/bootstrap.min.js

However the resources are not found, they are rather exposed as 

http://localhost:8080/plugin/bootstrap4-api/io/jenkins/plugins/bootstrap4/js/bootstrap.min.js

After some more digging I realized that the adjuncts are actually libraries and no plugins. So this seems to be not compatible. 

What is the right way to tackle this problem?

Should I locate JS libraries like bootstrap in a Jenkins plugin or in a library (jar) that I am depending on?

Should I refer to the JS files using something like <st:adjunct includes="io.jenkins.plugins.bootstrap4“/> or should I better define a tag lib that includes the JS files using simple script tags?

Or is there even another way that makes sense?

--
You received this message because you are subscribed to the Google Groups "Jenkins Developers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to jenkinsci-de...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/jenkinsci-dev/CANfRfr2iJdgEEppzRKTwfYYWzUHMnPJKFp5QcRKLe1teCYy5JA%40mail.gmail.com.

[Ullrich Hafner]

For the record: I fixed the problems now. JS now loads correctly in Jenkins and in Jenkins test harness. 

 

I needed to initialize the variables ${resURL} manually in each Jelly file:

<j:new var="h" className="hudson.Functions" />
${h.initPageVariables(context)}

Then the new UI JS plugins can be simply referenced by using an adjunct like

<st:adjunct includes="io.jenkins.plugins.bootstrap4“/>

This resolves all JS and CSS files below

${resURL}/plugin/bootstrap4-api/*

An example of such a view is available at

https://github.com/jenkinsci/forensics-api-plugin/blob/1da271633a776e9fcee586861414a20f726ffd38/src/main/resources/io/jenkins/plugins/forensics/miner/ForensicsViewModel/index.jelly

I will prepare a blog post that introduces these new JS plugins in the next couple of weeks…