Accessibility

These are exciting times, right? While everyone is preparing for the coronavirus, we’ve been preparing for Review Board 4.0 beta 1.

Review Board 4.0 Beta 1

And the coronavirus.

The shelves are getting pretty empty in my local grocery store, but I’ve kept my sanity.

Preparing for Review Board 4.0 Beta 1

We have an internal target date for 4.0 beta 1, which is coming up very soon, but we’re not prepared to release that just yet. Still a couple factors that might need to delay a week.

This beta will feature:

Posting and reviewing multi-commit review requests
A brand new, streamlined, mobile-friendly administration UI
A full move to Django 1.11, with preliminary Python 3 support (which will affect extensions, so get ready)
Read-only mode, letting you prepare for an upgrade without shutting the whole server down
A new “Overview” mode in the Dashboard showing all incoming and outgoing review requests
A new integration for Jenkins CI
Live thumbnails for video file attachments
Beginnings of accessibility improvements, improving keyboard input, color contrast, and screen reader integration
New JavaScript and CSS components usable by third-party extensions
An overhaul of the diff parsers, setting things up for some major future improvements to diffing capabilities (including our in-development new DiffX proposal)
Removal of a lot of deprecated internal APIs (again, this may affect extensions)

We’re working on the final bits of the administration UI, and expect to be done by end of next week. Everything is in place, with the exception of the Integrations, Extensions, and Security Center pages. But that’s it!

We’ve also been finishing up the work to make our third-party integrations (Travis-CI, Asana, Jenkins, etc.), Review Bot, and Power Pack all compatible with Review Board 4.0, Django 1.11, and Python 3. These are the last big blockers before release.

After all that is done, beta 1 will be a go!

(Assuming none of us get the coronavirus.)

If you are building custom extensions, please get ready to test this beta. Let us know if you plan to test so we can coordinate with you and give you a heads up on what may change.

RBTools 2.0 Beta

RBTools 2.0 features full support for multi-commit review requests. We’ve had the bulk of this work done for a while, but have been really thoroughly testing it in preparation for a beta, which will go out alongside Review Board 4.0 beta 1.

This week, we’ve finished up the work to apply patches from a multi-commit review request (giving the ability to apply all commits sequentially or squash into a single commit), and to fully land changes.

We’re wrapping this up soon. If you test Review Board 4.0 beta 1, you’ll need RBTools 2.0 beta 1.

What else, what else..

Accessibility Improvements

We’re continuing to work toward improving our accessibility story in Review Board. While we’re nowhere close to where we want to be yet, we’ve amended our policies around new UI components to ensure that keyboard usage and ARIA roles are a first-class citizen in any designs.

If you make use of any assistive technologies, such as screen readers, we’d love to talk to you and get your feedback on a few things!

Video Thumbnails

Review Board 4.0 will be making it easier to glance over file attachments for video files. Just like file attachment thumbnails for images and text files give you a preview of the contents, they’ll soon give you a preview of the video as well.

Hovering the mouse over these thumbnails will cause the video to play (muted) until you move the mouse away. Hovering over them again causes the video to resume from where it left off.

This is great if someone’s using video files to demonstrate their feature. We’re hoping to make this the start of some useful UI around videos.

New UI Components

This past week saw the development of several new accessible CSS/JavaScript components, which can be used by extensions:

New Button Classes

We’ve historically had a few different ways to show buttons. Any <input type="button" />, <input type="submit" />, or anything with the .btn CSS class would have a consistent appearance, and could be modified by a set of additional CSS classes.

This has been revised to include <button> (which we oddly did not have before) and anything using the .rb-c-button CSS class (the successor to .btn, which is now deprecated).

Button Groups

A button group (.rb-c-button-group in LessCSS) is a collection of buttons, packed together either horizontally or vertically, providing an almost toolbar appearance.

Pop-up Menus

Pop-up menus

The new RB.MenuView (JavaScript) and .rb-c-menu (LessCSS) component manages a pop-up menu that can be shown or hidden as needed. It supports full keyboard navigation and ARIA attributes for accessibility.

We’re working on moving to this in every place that involves a pop-up menu, including review request actions (like “Update” and “Close”) and the Account, Support, and Follow menus in the upper-right of pages.

Menu Buttons

Menu buttons

RB.MenuButtonView (JavaScript) and .rb-c-menu-button (LessCSS) implements a type of button that displays a pop-up menu when clicked.

There are two main ways this can be used:

As a single button that will show some text and a drop-down indicator, used just to display the menu.
As a group of action buttons, all packed together (but visually separated), containing a final button that displays the drop-down menu.

The later is great when you want to offer a common action, but make alternative actions easily available.

Like the new pop-up menus, these provide full keyboard navigation and ARIA attributes for accessibility, and are a great building block for extensions to use.

We hope to provide full documentation at a later time on the standard library of UI components we’re building.

New KGB Release Coming

KGB is our Python module for unit tests, which provides the ability to spy on any function and track the calls and results, or override the behavior. It’s incredibly powerful, and we make heavy of use of it in Review Board and all our other projects.

We’ve just fixed up KGB to work with Python 3.8, so we’re preparing for a release pretty soon.

If you’re a Python developer, check out KGB. Tell your friends. Give us some feature requests. Honestly, it’s pretty complete these days, but we need more reasons to bump the version number.

Alright, that’s enough for this ChangeLog.

Coming Up

We may skip next week’s ChangeLog to focus on finishing beta 1, unless we have anything really interesting to report.

If you want to know more, have any questions, or are curious about anything else, please reach out on our community forum.

We’re also on Reddit (/r/reviewboard), Twitter, Facebook, and YouTube if you want other ways to keep up with Review Board and Beanbag.

Hi everyone, and welcome to this week’s ChangeLog. This week, we want to talk about accessibility improvements for Review Board 4.0, and show you what this semester’s students are working on.

If you want to watch some videos instead of reading a bunch of stuff, jump down to Student Demo Videos!

Accessibility in Review Board

As we revise parts of our UI, introducing new features and designing new CSS Components, we have a goal of improving accessibility. We’re aiming to better support screen readers, improve keyboard navigation, and help people with visual impairments.

This will not be 100% implemented by 4.0, since we do plan to release sometime soon, but we will have laid the groundwork, working toward eventually being fully compliant with the Web Content Accessibility Guidelines (WCAG) 2.1.

There’s a lot that goes into accessibility on the web, but there’s two key areas that are important to get right, and are becoming a core part of our design and CSS component specifications: ARIA attributes and keyboard navigation.

ARIA attributes help screen readers and other assistive technologies understand, navigate, and communicate parts of the UI. They can communicate the intent of a UI component, provide more suitable labels or hints to screen readers, notify as important content updates, and more. They’re important, and we haven’t been good at using them, but they’re now being baked in to the design of any new UI we write.

Keyboard navigation is also very important. Not everyone can or wants to use a pointing device to navigate the UI, and we’ve identified several places where keyboard navigation (and focus presentation) is subpar or flat-out broken. So we’re making this a first-class citizen in new UIs, adding new keyboard shortcuts for important content areas or operations, and fixing cases where navigation is just busted.

To be clear, these aren’t the only focuses — there’s a lot more to the accessibility work than this. Improving accessibility is a long-term goal, and Review Board is a big product. We aren’t holding up 4.0 for this, but rather expect to spend time throughout the 4.0.x release cycle to gradually work on this.

And it’s a current focus of some of our student projects.

Student Demo Videos

In an earlier ChangeLog, we announced our new team of students working on Review Board. The big focuses this semester are on keyboard accessibility and first-time setup improvements.

They’ve been working hard for a month now, and have just completed their first (of three) demo videos. We’d like to show them off.

All videos are uploaded to our YouTube channel. Subscribe to keep up with content as we upload it.

Hannah Lin

Hannah’s been working on implementing keyboard navigation for file attachments, letting users focus on the attachments and control the pop-up menu (for reviewing, updating attachments, deleting, and downloading). That was her first warm-up project.

Her main project for the semester is working on a first-time setup guide, for new Review Board administrators. The goal is to help them get a new server up-and-running fast by walking them through the main setup steps as they progress through the administration UI.

Katherine Patenio

Katherine’s first demo covers some initial bug fixing work for RBTools on Python 3, addressing a problem where --help didn’t always work. She’s fixed this up and added a new layer of unit tests we can build upon.

Her main project for the semester isn’t covered here, but she’s going to be working on the rbt setup-repo command, helping streamline getting a new repository set up with Review Board.

Monica Bui

Monica’s also working on keyboard accessibility. Her focus in this demo is improving the New Review Request page, making sure that all elements can be tabbed to and navigated entirely by keyboard.

Xiaohui Liu

Xiaohui’s first project fixes up tab key navigation in the review request page. Previously, tabbing to fields would prioritize the fields on the right-hand side of review requests (Branch, Bugs, etc.) before the main fields (Description, Testing Done), which wasn’t really intuitive. His fix brings some sanity back to tab orders.

His second project is to implement common support in the UI for keyboard shortcuts, making it much easier for us to bake in better keyboard support on every page with less code to worry about.

Xiaole Zeng

Xiaole’s working on improving help within the product, giving users both a single place to go to when needing to find documentation or other useful information, and finding places within the UI where we can offer better inline guidance. For the latter, she’s working on adding helpful descriptions and documentation links when configuring repositories, based on the selected hosting service or repository type.

Next Week

We’re getting a new RBTools release ready to ship, so you’ll see that soon. We’re also testing 4.0 beta 1, and are getting that beta release on the calendar.