Add support for tabs for the experimental run page #11141

janfaracik · 2025-10-01T15:51:01Z

Three tabs have been added as part of this PR, them being:

Overview - the first person the user lands on when they open a run, it shows a high level overview of everything in said run
Console - the classic freestyle console view (this hides if you change the default console UI provider, e.g. to Pipeline Graph View)
Changes - the classic changes view

Implementation

A new class Tab has been added, which extends Action, to allow core and plugin developers to add items to the tab row on the experimental build UI.

Plugins can opt-in to this new UI with the temporarily titled <l:run-subpage /> component, which is the frame (the build title, tabs, and actions) that wrap the plugin content.

Pipeline Graph View implementation

I've opened a draft branch for Pipeline Graph View to hook into this to give everyone a better view of how this works.

See jenkinsci/pipeline-graph-view-plugin#987 for more details.

Testing done

Proposed changelog entries

Add support for tabs on the experimental run page.

Proposed changelog category

/label web-ui,rfe,developer

Proposed upgrade guidelines

N/A

Submitter checklist

The Jira issue, if it exists, is well-described.
The changelog entries and upgrade guidelines are appropriate for the audience affected by the change (users or developers, depending on the change) and are in the imperative mood (see examples). Fill in the Proposed upgrade guidelines section only if there are breaking changes or changes that may require extra steps from users during upgrade.
There is automated testing or an explanation as to why this change has no tests.
New public classes, fields, and methods are annotated with @Restricted or have @since TODO Javadocs, as appropriate.
New deprecations are annotated with @Deprecated(since = "TODO") or @Deprecated(forRemoval = true, since = "TODO"), if applicable.
New or substantially changed JavaScript is not defined inline and does not call eval to ease future introduction of Content Security Policy (CSP) directives (see documentation).
For dependency updates, there are links to external changelogs and, if possible, full differentials.
For new APIs and extension points, there is a link to at least one consumer.

Desired reviewers

@mention

Before the changes are marked as ready-for-merge:

Maintainer checklist

There are at least two (2) approvals for the pull request and no outstanding requests for change.
Conversations in the pull request are over, or it is explicit that a reviewer is not blocking the change.
Changelog entries in the pull request title and/or Proposed changelog entries are accurate, human-readable, and in the imperative mood.
Proper changelog labels are set so that the changelog can be generated automatically.
If the change needs additional upgrade steps from users, the upgrade-guide-needed label is set and there is a Proposed upgrade guidelines section in the pull request title (see example).
If it would make sense to backport the change to LTS, a Jira issue must exist, be a Bug or Improvement, and be labeled as lts-candidate to be considered (see query).

commit f998b55 Merge: 43bf0ff b2dff28 Author: Jan Faracik <[email protected]> Date: Fri Sep 26 11:31:44 2025 +0100 Merge branch 'master' into refine-description commit 43bf0ff Author: Jan Faracik <[email protected]> Date: Fri Sep 26 11:31:35 2025 +0100 Update core/src/main/resources/lib/hudson/editDescriptionButton.jelly Co-authored-by: Tim Jacomb <[email protected]> commit 5c034fb Author: Jan Faracik <[email protected]> Date: Fri Sep 26 07:30:29 2025 +0100 Change to compact attribute commit b3bd7a6 Author: Jan Faracik <[email protected]> Date: Thu Sep 25 08:07:17 2025 +0100 Refine experimental add/edit description button

…un-page

core/src/main/java/hudson/model/Run.java

core/src/main/java/jenkins/model/Badgeable.java

core/src/main/java/jenkins/model/Tab.java

core/src/main/java/jenkins/run/ChangesTab.java

core/src/main/java/jenkins/run/ChangesTabFactory.java

core/src/main/java/jenkins/run/ConsoleTab.java

core/src/main/resources/hudson/model/AbstractBuild/tasks.jelly

core/src/main/resources/lib/layout/tabs.jelly

timja · 2025-10-07T13:03:22Z

core/src/main/java/jenkins/run/ConsoleTab.java

+
+    @Override
+    public String getUrlName() {
+        return "console";


Nice to have: This isn't active when the page is consoleFull, i.e. when viewing a large log.

This is a pre-existing issue so not a blocker.

timja · 2025-10-07T13:07:05Z

I think this is quite close, anyone else want to look it over?

core/src/main/java/hudson/model/Run.java

timja · 2025-10-07T20:38:21Z

core/src/main/resources/hudson/model/AbstractBuild/tasks.jelly

  <j:choose>
    <j:when test="${newBuildPage}">
      <l:task href="${buildUrl.baseUrl}/changes" icon="symbol-changes" title="${%Changes}"/>
-      <p:console-link/>


pipeline still needs fixing for this AFAICT (unless I need to update a plugin)

Opened jenkinsci/workflow-job-plugin#563 to address this

Tested and looks good

uhafner

I like the new UI! Since the UI is hidden behind a feature toggle, it makes sense to merge this change and refine it in subsequent PRs.

Things what are not perfect right now:

Why is there a console card in the overview when there is already a tab with the same content?
The console overview card does not fill the whole width, the bottom card does. This should be consistent. The Edit build description text area has yet another width. I think in UI design we should work more with grids.

When I click on the edit description button, then the button disappears, I'm not sure if this is a common UI pattern.
Having a scrollable card (console) results in a bad user experience when trying to scroll to the bottom: the mouse is captured by the console card.
I like the new header with the tabs and previous/next buttons. I wonder, why this header is not fixed and scrolls away when scrolling down. I think it should be always visible at the top of the screen.
This is a general UI problem in the new Jenkins design library: it is not clear for users anymore which elements are clickable, and which not. You need to hover over the element to see that it is actually a link. E.g., the "Trigger" of a build is clickable, but "Started at" and "Took" (same font and color) are not clickable.

PS: this review is only a UI review without looking at the code!

timja · 2025-10-08T20:15:11Z

/label ready-for-merge

This PR is now ready for merge, after ~24 hours, we will merge it if there's no negative feedback.

Thanks!

Change jenkinsci#11141 added display: flex with direction column to jenkins-card. This broke the styling of the api token display This makes the api-tokens more independent from jenkins-card

* Fix api token css Change #11141 added display: flex with direction column to jenkins-card. This broke the styling of the api token display This makes the api-tokens more independent from jenkins-card * prettier

* Fix api token css Change jenkinsci#11141 added display: flex with direction column to jenkins-card. This broke the styling of the api token display This makes the api-tokens more independent from jenkins-card * prettier

janfaracik added 25 commits September 26, 2025 21:23

Init

16d813f

Refine description

2e58ded

Refine

de9753e

Update _cards.scss

c178d9a

Merge branch 'master' into new-experimental-run-page

24ced46

Update new-build-page.jelly

fc0fc74

Push

3902855

Update new-build-page.jelly

1e28bc0

Fix description merge

a732ec1

Merge branch 'fix-description-merge' into move-run-sidepanel-to-overflow

af726c0

Refine

ea99b2e

Merge branch 'move-run-sidepanel-to-overflow' into new-experimental-r…

b15b2eb

…un-page

Push

a5283a2

Merge branch 'master' into move-run-sidepanel-to-overflow

bbfa7a9

Merge branch 'master' into new-experimental-run-page

8600476

Merge branch 'move-run-sidepanel-to-overflow' into new-experimental-r…

01ce059

…un-page

Update run-host.jelly

736e8f1

Refine

78c325b

Update dir.jelly

298bd15

Push

53b0a0e

Refine

14b777d

Merge branch 'master' into new-experimental-run-page

550bf9b

Update Run.java

43b6981

Update dir.jelly

fda054d

timja requested a review from a team October 1, 2025 16:03

comment-ops-bot bot added web-ui The PR includes WebUI changes which may need special expertise rfe For changelog: Minor enhancement. use `major-rfe` for changes to be highlighted developer Changes which impact plugin developers labels Oct 1, 2025

Refine

798b8c4

Merge branch 'master' into new-experimental-run-page

f867f6b

janfaracik marked this pull request as ready for review October 7, 2025 08:34

Update changes.jelly

8dea20e

timja reviewed Oct 7, 2025

View reviewed changes

core/src/main/java/hudson/model/Run.java Outdated Show resolved Hide resolved

timja reviewed Oct 7, 2025

View reviewed changes

core/src/main/java/hudson/model/Run.java Outdated Show resolved Hide resolved

timja reviewed Oct 7, 2025

View reviewed changes

timja requested a review from a team October 7, 2025 13:06

timja and others added 3 commits October 7, 2025 14:11

Merge branch 'master' into new-experimental-run-page

66926b1

Fix licence, rename tabs class

691f72a

Add licence header

897a015

timja mentioned this pull request Oct 7, 2025

Support :has() HtmlUnit/htmlunit-cssparser#20

Closed

Update Run.java

e2bd2a1

timja reviewed Oct 7, 2025

View reviewed changes

core/src/main/java/hudson/model/Run.java Outdated Show resolved Hide resolved

Update Run.java

9894dbf

timja reviewed Oct 7, 2025

View reviewed changes

janfaracik mentioned this pull request Oct 7, 2025

Update sidepanel for experimental Run UI jenkinsci/workflow-job-plugin#563

Merged

6 tasks

timja approved these changes Oct 8, 2025

View reviewed changes

timja requested a review from a team October 8, 2025 09:16

uhafner approved these changes Oct 8, 2025

View reviewed changes

comment-ops-bot bot added the ready-for-merge The PR is ready to go, and it will be merged soon if there is no negative feedback label Oct 8, 2025

timja merged commit 893c4b5 into jenkinsci:master Oct 9, 2025
18 checks passed

timja deleted the new-experimental-run-page branch October 9, 2025 21:48

jglick mentioned this pull request Oct 15, 2025

[JENKINS-76202] Avoid stack overflow when new run UI is enabled #11203

Merged

14 tasks

mawinter69 mentioned this pull request Nov 20, 2025

Fix api token rendering #11321

Merged

14 tasks

Uh oh!

Add support for tabs for the experimental run page #11141

Add support for tabs for the experimental run page #11141

Uh oh!

Conversation

janfaracik commented Oct 1, 2025 • edited by MarkEWaite Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Implementation

Pipeline Graph View implementation

Testing done

Proposed changelog entries

Proposed changelog category

Proposed upgrade guidelines

Submitter checklist

Desired reviewers

Maintainer checklist

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

timja Oct 7, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

timja commented Oct 7, 2025

Uh oh!

Uh oh!

timja Oct 7, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

janfaracik Oct 8, 2025

Choose a reason for hiding this comment

Uh oh!

timja Oct 8, 2025

Choose a reason for hiding this comment

Uh oh!

uhafner left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

timja commented Oct 8, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

janfaracik commented Oct 1, 2025 •

edited by MarkEWaite

Loading

timja Oct 7, 2025 •

edited

Loading

timja Oct 7, 2025 •

edited

Loading

uhafner left a comment •

edited

Loading