Rough summary of the changes

Front end

The auth callback is written in React and lives under the /login.html endpoint. It communicates with Treeherder using the localStorage.

Credential expiration

The Django user session expiration is set to expire when the client access token or the id token expires (whichever one expires first). These values are controlled by the IAM team. Presently, the access token expires after 1 day and the id token expires after a week. That being said, the session will therefore expire after 1 day. If you want this value change, we simply need to send a request to the IAM team.

Credential renewal

Renewals are set to happen every 15 minutes or so. The renewal is skewed slightly so that different open tabs don't renew at the same time. Once renewal happens, both tokens are renewed and the Django session is updated.

Migration

If the userSession localStorage key is not set, then the user will be logged out including logging out from the Django session. In other words, all users will be automatically logged out when the merge to production happens.

Main Features

• Be able to highlight different error lines
• Get rid of "double hashing" when linking to a specific line number
• Smooth scrolling
• Highlight single and multiple lines
• Follow log (option to scroll to the bottom of the log)

This change is

Apparently I can't reopen a closed pull request if I've force-pushed to it in the time it was closed. Fun.

Anyway... This is very close to being ready for review. Still need to fix up a few things, but I'm hoping to get that done by the end of the week.

This is the first draft. I still have to change some stuffs(lot of stuffs), but I'd like to have some feedback, to see if I'm doing everything right, or if something can be changed.

This is the final react conversion pr - woohoo!

In addition to setting up the routes, I've made these other changes:

• Using top-level of app as a cache for projects, frameworks, alerts data and compare data
• Cleanup files and move constants to dedicated perfherder file
• Removed angular-related libraries and bump down the neutrino entry and asset limits

@ionutgoldan it'd be worth you giving all the views a quick test. I unfortunately had a lot of squashing of commits to do during the rebase and I want to make sure the new retrigger action is working as expected. I'd also like to ensure that the fetched data that's stored from the alerts view (when navigating back from an individual alert), and the fetched data that's stored from the compare view (when navigating back from the comparesubtest view) works as expected and doesn't cause any issues. I've launched it to prototype.

FYI @karlht and @davehunt

Description of issue

Some color combinations does not pass the WCAG contrast recommendation.

Also, for color blindness distinction, texts with red and green should be accompanied by an icon.

Strategy

Using Firefox Accessibility Inspector's beta "Check for issues", I've checked for "Contrast" issues. That was done for each view and a different commit was made. Then, it was a manual color tweaking of each issue.

Some colors became harder to distinguish because of the contrast rate. That was seem mostly in blue and green colors. Maybe propose a different color hue?

Testing

Those were mostly visual and using Accessibility and Inspector devtools tabs.

Moving the contents of the Treeherder-Tests repo into the /selenium folder. Tests will not run automatically, as Travis will need to be set up. This is just to get the content into the primary repo going forward so that the Treeherder-Tests repo can be decommissioned.

This change is 

Bumps django from 3.1.13 to 3.2.8.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

This is a just a WIP demo at the moment, but I'm filing a PR for more visibility/discussion. This patch adds some red lines to the Perfherder graph to show when changes to our CI machines have occurred so that sheriffs have an easier time telling whether a change in perf numbers is due to a code change or a CI config change. Hovering over/clicking on the red lines will show a popup describing the change with links to the commit.

Note: this currently shows every change from the CI changelog for testing, so there are a lot more red lines than we'd normally see. In a real version of this, we'd probably restrict it to only show actual deployments.

Description of issue

Perfherder's Graph View contains graphs and elements which are not screen reader accessible.

Tasks:

• [X] Get Graph data into table;
• [X] Highlight Revision;
• [x] Add Tooltip information;
• [ ] When highlight, show and focus highlighted row;
• [ ] Toogle column's visibility;
• [x] Add tests.

Next PR:

• (Needs investigation) Show trends and outliers;

Proposed Solution

• A button next to "Add test data" was added, to toggle between Graph and Table view.

• If there is any highlighted revision, its table row will have a yellow background and an aria-label of "highlighted revision".

• Users can show and hide test via Checkbox in Legend Card:

Testing

• Compared some data points in the graph to the ones shown in table cells.
• Turned highlighted revisions on and off and check if it propagated both in the graph and table.
• Still was not able to test with SR. I will edit here once it's done.

Description of issue

The Graph view in Perfherder is not very usable for color blind users, mainly when there are multiple types of data plotted. To improve it, it was suggested to choose a friendlier color palette and also use auxiliary symbols to help distinguish between data.

• [x] Change symbols in graph to different ones
  • [X] When graph is first created
  • [x] When more graphs are added
• [x] Insert symbol in LegendCard
• [X] Propose better color palette

Proposed Solution

• In order to change the graph symbols, the VictoryScatter prop symbol in VictoryChart's library was used. The symbol name is passed from GraphView to GraphContainer, based on the stored value from constants.js

• In LegendCard, the name of the symbols have been retrieved, but in order to insert the icon, some decisions must be made - the icons are <svg> and live in another file? Are they React Components? Maybe we could use the same svg Victory Chart uses.

• As for the color palette, some research and experiments were made. 3 of the 6 colors were changed.

Testing

A visual test was made, with help of NoCoffee Add-On. It was tested with all available Color deficiency options.

This ensures:

• On pull-requests probe-scraper can verify that Glean metrics are declared correctly.
• On pushes to the default branch probe-scraper is informed to generate metrics data in the pipeline, to fill the Glean Dictionary and populate the table schemas.

This is part of Step 4 of adding Glean to your product. See also https://github.com/mozilla/probe-scraper/pull/538 for enabling it in probe-scraper to begin with. This requires enabling GitHub actions on this repository. Someone with write/admin access probably needs to do that.

Ingest the bug creation timestamp to count new intermittent bugs without depending on timestamp of first classification. Setting as bugs as duplicates breaks this assumption.