This merges the definitions that were in design_tokens into
theme_colors.css and application_color_tokens.css.
In a follow up, we'll rename these two (theme_colors and
application_color_tokens). Keeping the same name here in order to
keep the diff easier to read for review purposes.
Bug: 390330089
Change-Id: Ia8510ca0818d31409250c1d5e6ef67897e6fc193
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6203922
Reviewed-by: Benedikt Meurer <bmeurer@chromium.org>
Commit-Queue: Kim-Anh Tran <kimanh@chromium.org>
Reviewed-by: Kateryna Prokopenko <kprokopenko@chromium.org>
This is the first part of our goal to merge the token css files
(token.css, theme_colors.css, design_tokens.css and
application_color_tokens.css). In the end, we want to end up
with two css files only.
This CL makes the following changes:
1. Move the content from `tokens.css` into `theme_colors.css`
2. Remove `tokens.css`
Note that this CL is simply moving the content for simplicity of
reviewing.
More clean ups will follow.
Bug: 390330089
Change-Id: Id06de578b1f5bf5f6dda7674e356a2c9f0463e94
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6189457
Commit-Queue: Kim-Anh Tran <kimanh@chromium.org>
Reviewed-by: Benedikt Meurer <bmeurer@chromium.org>
This is the next step in unifying the way we inject CSS. While we should
probably have a proper `<devtools-text-button>` component instead of the
`.text-button` styles, I'm leaving that as a refactoring for later, and
for now, move the styles out of the legacy UI bundle and into the button
component.
Bug: 391381439
Change-Id: Id4708319dbfe2d609da0947ef9e3f7692723393b
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6189456
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Auto-Submit: Benedikt Meurer <bmeurer@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Passing an array to `path.join` is not supported, it takes unlimited
arguments rather than an array of one.
This was introduced in crrev.com/c/4678757, but I think the bots were
happy because they do not use the index page and instead navigate
directly to examples. This error only triggered on the index page.
As a drive-by, I also bumped the font size as otherwise they use the
default, rather small, DevTools font size.
Bug: none
Change-Id: I580c454d62e3ce66065bdb21c2fc7b0349825637
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/4685569
Reviewed-by: Andres Olivares <andoli@chromium.org>
Commit-Queue: Andres Olivares <andoli@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
This way we ensure colors loaded from this file are available in the
component examples and screenshot tests, since it seems that after
https://crrev.com/c/4650363 , some colors for icons were no longer
available in the component server (see screenshots updates).
This CL adds the missing stylesheet to the server and adds it to a
reusable array so that stylesheet paths don't have to be hardcoded
multiple times.
Note: I forced a screenshot update so many goldens that are unrelated
to this issue are also re-baselined.
Bug: none
Change-Id: I8adcfbdd4966706a9b6f15d0947b4ef0ac0e96f4
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/4678757
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Kateryna Prokopenko <kprokopenko@chromium.org>
Commit-Queue: Andres Olivares <andoli@chromium.org>
For convenience, since the bots will still use the JSON file.
Also, an option to define the folders on which coverage will be
calculated is added to the interaction tests. The flag works
identically to the COVERAGE_FOLDERS of unit tests, i.e. a pattern is
provided to define the included folders. For example: the flag can be
set like COVERAGE_FOLDERS=
front_end/{models/trace,models/timeline_model,panels/timeline}
These two changes should help to calculate the total OPP coverage in
go/opp-test-coverage
Bug: 1424729
Change-Id: Ie982f62dfac0014c05075e53173a8e7710d3b9e0
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/4345493
Commit-Queue: Andres Olivares <andoli@chromium.org>
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
All interaction tests are now lazily instrumented with Istanbul
to obtain code coverage. The interactions tests can be started
with `COVERAGE=1` to obtain coverage. For that, the Mocha hooks
perform the eventual reporting and gathering of data. The instrumentation
is performed in the components server itself.
To make sure that we perform the minimal amount of work required
(since code coverage instrumentation is computationally expensive),
we preload pages to populate the instrumentation cache. Every
interactions tests should preload an example (most likely basic.html)
to populate the cache. Every subsequent test will then use the
already-instrumented code, rather than computing the code over
and over again.
The eventual code coverage is written to /interactions-coverage.
The results will eventually be merged with /karma-coverage
to obtain the union of both unit and interaction tests coverage.
R=aerotwist@chromium.org,jacktfranklin@chromium.org
Bug: 1206705
Change-Id: I5e19b1ecef23d21107210699cb29800556e0415e
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2879986
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
The component server needs to inject CSS and JS scripts into each
example. It was doing this by relying on a <style> and <script> tag as
the hook to inject more code. But if you have an example without a
<style> or <script> tag, it won't work. Instead we now inject based on
the </head> and </body> tags, which will always exist (or, if they
don't, we have bigger problems!)
Bug: None
Change-Id: Id2f586c917ee7ab0821d5ab8e50e5cd3d3647a92
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2815131
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
The current tests try to figure out the root directory and then glob
for _test.ts files within there, but this breaks easily if the folder
structure isn't exactly as expected. Instead we can set this via a
flag in the test runner.
This CL only updates the interaction tests, which use the new runner.
e2e tests will be supported in time.
Bug: chromium:1186163
Change-Id: I198b67bf0081ce7334c40d7d661fb8642c2d56d0
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2772045
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
This CL adds two flags to the new test runner for configuring the
components server and then updates the server to detect those values.
Note that whilst this CL adds yet-another-way to configure the
components server, this is only being done for backwards compat whilst
we roll out this change to all the various places. We will remove old
options towards the end of this work.
Bug: chromium:1186163
Change-Id: I4c9b85a5745b9fe36894e3c492952938a5b8f648
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2763875
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
It seems there is no requirement for these files to be split; they don't
seem to have a logical split and they are both injected into the `body`
element when DevTools runs. If we kept both of these files around, we'd
have to inject them both into the component docs helpers, and deal with
both of them when it comes to figuring out where legacy CSS variables
are defined.
To make it a bit simpler I've merged `inspectorStyle` into
`inspectorCommon`. I went this way because:
* `inspectorCommon.css` is (I think!) a better name than `inspectorStyle.css`
* `inspectorCommon.css` was bigger.
I also drive-by disabled the stylelint `comment-empty-line-before`,
which was forbidding empty lines before any CSS comments; which made the
entire file feel very squashed!
Bug: none
Change-Id: Ifaa834c7bf56291561e2e5cc124c4efd85c3cc56
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2716285
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Kim-Anh Tran