This is not complete in that it doesn't expose all the same paths, but
I'd rather have people add to them as they go. I've defined the main
paths we'll need - third_party, node and devtools root.
I tested this locally by having it print out the paths and I updated the Python
equivalent to do the same. I ran the commands both locally in my devtools repo
and from the Chromium repository.
Bug: chromium:1166572
Change-Id: Ia0403b9b861d5cf58234bcf16d7ad247184233a4
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2626301
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
LitHtml strongly discourages this approach and it's one that often can
be avoided using CSS custom properties that are set from JavaScript, so
we're going to try to avoid its usage creeping into our codebase. We can
revisit if we hit upon a case where it's really needed.
Bug: chromium:1166108
Change-Id: Ib8c60d8670707b8f0e239d911ec569c64a3b1846
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2626294
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Uses the new script to generate the dark mode styles for cmdevtools so save us
manually processing it. Tested by clicking around the sources panel in light and
dark mode and verifying that things look as expected.
Also fixed some bugs in the generator script to ensure we generate the
right selectors.
Bug: 1152736
Change-Id: If3491651be116033be7248e695ceab1de5f3fc5c
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2593129
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Writing the component docs example inline makes it easier to quickly
through an example together but means we lose any type checking on the
examples.
This CL migrates one example to TS and updates the ES Modules Import
lint rule to allow component docs files to import the test helpers -
which we do to allow them to emulate a full DevTools environment if
required.
This change caught some invalid config in the component doc example so I
think if we can make this migration across all the component doc
examples it will help ensure our examples are up to date and valid.
Bug: 1144106
Change-Id: I32cf0e09bfe158ae5ba9b57dbc535e14a9985a5f
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2613206
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Now the server can serve from the tests directory, it will sometimes get
two requests for the same file, one prefixed with front_end and the
other not. If that happens the server now redirects the request such
that we only ever serve each file once and the browser doesn't
double-execute a module.
Change-Id: I14b44aad8b16d1c3f2f787082c70532a8f8776e9
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2599746
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Paul Lewis <aerotwist@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
Most of the time we won't need this fully fledged environment, but for
some things (such as context menus, guess what I'm working on right now
:D) we do need a faked out environment to enable these features to run
when we run the component in isolation in the component docs.
Note: while this CL contains no component docs changes that take
advantage of it, I've tested locally with context menus in the data grid
and this change does work.
Fixed: 1148323
Change-Id: Ic8c508840a20b6d0f0e72fd7019a16271f04bea6
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2597313
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
This CL provides a script that generates a dark mode stylesheet for a
given sheet, just like the runtime color patching (in fact, it uses the
same code!).
The script loads up the given CSS file, imports `ThemeSupport`, and
patches it. It then takes the final CSS file and prefixes
`:host-context(.-theme-with-dark-background)` to each selector. We can
then load the lightmode and the dark mode stylesheet into DevTools.
This is non ideal because we end up loading two stylesheets, but the
alternative is to maintain the runtime color patching for ever, or
update all third party stylesheets to use our CSS variables, which is a
lot of work.
The script does rely on the hosted mode server running but I think this
is reasonable; it's only going to be run rarely on a few CSS files, so
we won't be running it automatically on CI or anything so we can keep
the process fairly manual.
Bug: 1152736
Change-Id: I707c53fbccb3e03c9fac6691f40df32bcdb17c1f
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2587024
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
If you're in the front_end directory and you mistakenly include
front_end in an import, e.g:
import * as UI from '../../front_end/ui/ui.js';
instead of:
import * as UI from '../ui/ui.js';
It will cause problems in a release build. This CL lands an ESLint rule
to ban these, but still allows it for unit tests.
Fixed: 1157057
Change-Id: Ia49279794616568f9e88241152e3412fcd9a8b36
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2581547
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
On the bots these tests will run in out/Release but the component server
logic for figuring out the path to the gen directory was wrong; it
navigated up from its position into the root dir, and then back in to
`out/TARGET`. Rather than do that, we instead just walk up from the
scripts dir until we end up in the out/TARGET directory. That way
regardless of if we run in out/Default or out/Release, the script will
find the right directory.
Bug: 1153281
Change-Id: I1d369e47b9931ade60bc86ff52aea7105f10cefd
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2575086
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Paul Lewis <aerotwist@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
depot_tools ships a "vpython" binary that is added to the $PATH
for all Chromium engineers. This binary is versioned by depot_tools
which we roll in ourselves as part of `gclient sync`.
By using `vpython` instead of `python`, we are no longer depended
on the Python version installed locally and instead use the version
we pull in from DEPS.
R=liviurau@chromium.org
Change-Id: If49a54c24b6cf129ff843cd9ca1140a723a78afb
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2571462
Reviewed-by: Liviu Rau <liviurau@chromium.org>
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Both front_end_devtools_module_entrypoint_sources and
generated_devtools_module_entrypoint_sources were unused, since
the `devtools_entrypoint` migration has finished.
Secondly, we can rename generated_typescript_entrypoint_sources to
generated_module_entrypoint_sources, since we no longer need to
distinguish between JavaScript and TypeScript entrypoints.
Lastly, we can clean up the definition of
devtools_module_entrypoint_sources to no longer include the
$resources_out_dir line, which saves some duplication.
R=aerotwist@chromium.org
Change-Id: I1a327cf40cec6630b3be7ac53e2c87f7e179c895
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2566802
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Auto-Submit: Tim van der Lippe <tvanderlippe@chromium.org>
Reviewed-by: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
This CL introduces the infrastructure and first test for what we're calling
"Interaction tests". These are tests that can be used to test component
behaviour that cannot be tested via Karma unit tests but don't require an e2e
test either.
The best example here is complex user interactions: clicking and dragging a
mouse, or doing multiple tabs to navigate through the UI.
Note that the one interaction test added here for theme_colors isn't the best
example of a complex test, but it's a test that's good enough for now whilst we
get everything set up on infrastructure and make sure it runs without flaking.
Bug: 1153281
Change-Id: Ifb37639a557c459974f703b8954ae68a93d5d368
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2566808
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
vidorteg