Uploaded image for project: 'Jenkins'
  1. Jenkins
  2. JENKINS-56109

Jenkins Core: Change Jenkins configuration UI from tables to divs

    • 2.264 and 2.277.1

      Report all issues with a complete plugin list (reporting this as an issue in the changelog isn't helping anyone)

      JENKINS_HOST=username:password@myhost.com:port
      curl -sSL "http://$JENKINS_HOST/pluginManager/api/xml?depth=1&xpath=/*/*/shortName|/*/*/version&wrapper=plugins" | perl -pe 's/.*?<shortName>([\w-]+).*?<version>([^<]+)()(<\/\w+>)+/\1 \2\n/g'|sed 's/ /:/'
       

      Check if your plugin already has an issue reported https://issues.jenkins.io/issues/?filter=22840 (artifactory plugin is https://github.com/jfrog/jenkins-artifactory-plugin/issues/350

      If you know which plugin is causing the issue report a new issue, including steps to reproduce and screenshots and label it with 'tables-to-divs-regression'

       

      Historically, jenkins's jelly framework generated lots of tables. These tables are very mobile hostile. The ui it generates is also not in line with modern UIs.

       

      Here's one example from Windows 10's settings:

      Note that the label for a field is above the field – not to the left of the field.

      Here's a much older UI from Windows:

      Note that the labels for checkboxes/radios are to the right of the buttons, not to their left (* with RTL layouts, this changes, but that's due to mirroring and applies to almost everything).

       

      Even so, labels for other things are above, not to their left (see this example for invitation duration – which is also pre Windows 10):

       

      Examples can be seen in macOS, Maemo / MeeGo, and pretty much every system (including Chrome / Firefox / Android).

       

      This issue tracked the core jelly changes made to switch from generating tables to generating divs.

          [JENKINS-56109] Jenkins Core: Change Jenkins configuration UI from tables to divs

          Josh Soref created issue -
          Josh Soref made changes -
          Assignee New: Josh Soref [ jsoref ]
          Josh Soref made changes -
          Status Original: Open [ 1 ] New: In Progress [ 3 ]
          Josh Soref made changes -
          Link New: This issue relates to JENKINS-55787 [ JENKINS-55787 ]
          Oleg Nenashev made changes -
          Labels New: accessibility ux ux-sig
          Oleg Nenashev made changes -
          Summary Original: Change jenkins configuration ui from tables to divs New: Change Jenkins configuration UI from tables to divs
          Oleg Nenashev made changes -
          Priority Original: Minor [ 4 ] New: Major [ 3 ]
          Oleg Nenashev made changes -
          Epic Link New: JENKINS-62437 [ 206431 ]
          Oleg Nenashev made changes -
          Summary Original: Change Jenkins configuration UI from tables to divs New: Jenkins Core: Change Jenkins configuration UI from tables to divs
          Zbynek Konecny made changes -
          Description Original: Currently jenkins's jelly framework generates lots of tables. These tables are very mobile hostile. The ui it generates is also not in line with modern UIs.

           

          Here's one example from Windows 10's settings:

          !image-2019-02-12-15-44-44-739.png!

          Note that the label for a field is above the field – not to the left of the field.

          Here's a much older UI from Windows:

          !image-2019-02-12-15-45-51-351.png!

          Note that the labels for checkboxes/radios are to the right of the buttons, not to their left (* with RTL layouts, this changes, but that's due to mirroring and applies to almost everything).

           

          Even so, labels for other things are above, not to their left (see this example for invitation duration – which is also pre Windows 10):

          !image-2019-02-12-15-46-51-006.png!

           

          I can provide examples from macOS, Maemo/MeeGo, and pretty much every system (including Chrome/Firefox/Android). I happen to be using a Windows 10 laptop today (snow day), but normally I use macOS / Android.
          New: Currently jenkins's jelly framework generates lots of tables. These tables are very mobile hostile. The ui it generates is also not in line with modern UIs.

           

          Here's one example from Windows 10's settings:

          !image-2019-02-12-15-44-44-739.png|width=228,height=278!

          Note that the label for a field is above the field – not to the left of the field.

          Here's a much older UI from Windows:

          !image-2019-02-12-15-45-51-351.png|width=301,height=306!

          Note that the labels for checkboxes/radios are to the right of the buttons, not to their left (* with RTL layouts, this changes, but that's due to mirroring and applies to almost everything).

           

          Even so, labels for other things are above, not to their left (see this example for invitation duration – which is also pre Windows 10):

          !image-2019-02-12-15-46-51-006.png|width=333,height=232!

           

          I can provide examples from macOS, Maemo/MeeGo, and pretty much every system (including Chrome/Firefox/Android). I happen to be using a Windows 10 laptop today (snow day), but normally I use macOS / Android.
          Félix Queiruga Balado made changes -
          Link New: This issue causes JENKINS-62464 [ JENKINS-62464 ]

            jsoref Josh Soref
            jsoref Josh Soref
            Votes:
            0 Vote for this issue
            Watchers:
            14 Start watching this issue

              Created:
              Updated:
              Resolved: