[SourcesTree] Style debuggee URL domain #4463

svitlana-galianova · 2017-10-21T22:52:42Z

Associated Issue: #4259

Summary of Changes

added new svg style for domain icon
wrote code to highlight debuggee domain in light green

Test Plan

Tell us a little a bit about how you tested your patch.

Example test plan:

start debugger
start debugging a web page
observe the main domain being light green

Screenshots/Videos (OPTIONAL)

…er.html

…ools#4441)

James300 · 2017-10-22T01:36:24Z

That's really cool, looks good!

wldcordeiro · 2017-10-22T01:46:55Z

src/components/shared/Svg.css

 }

+.domain.debuggee {
+  fill: lightgreen;


Note: Maybe there's a green defined in the themes we can use here @jasonLaster?

var(--theme-toolbar-highlighted-color) ?

@nt1m I tried your suggestion and here is a screenshot of what I got:

To tell you the truth, I like green color more.

wldcordeiro

Nice job @svitlana-galianova I like the result of this. Just a note on the color choice but I think it looks great.

svitlana-galianova · 2017-10-22T01:57:54Z

@wldcordeiro thanks! It won't be a problem to change a color to whatever you think is the most suitable.

nt1m · 2017-10-22T03:06:26Z

src/components/PrimaryPanes/SourcesTree.js

-      return <Svg name="domain" />;
+      return <Svg name="domain" 
+       className={classnames({
+          debuggee: (this.props.debuggeeUrl != null && item.name != null && this.props.debuggeeUrl.indexOf(item.name) !== -1) ? true : false


This can be simplified to:

debuggee: this.props.debuggeeUrl && item.name && this.props.debuggeeUrl.includes(item.name),

You don't need the ternary that does true : false since your condition is already a boolean.

You do need the != null checks to avoid Flow complaining about sketchy existence checks.

@nt1m Thanks for your comment, I thought it would be smarter to use indexOf since it's supported in all the browsers and includes is only supported in the following browsers (according to w3school):

Don't worry about browser support, we use includes in other areas of the code base, you can feel safe using it :). For most cases, we have Babel, which transpiles es6 where necessary (so you will see things like spread operators which are not available everywhere being used already!) so feel free to explore modern JS as much as you like! our primary targets are modern chrome and firefox.

@codehag Thanks for your clarification!

nt1m · 2017-10-22T03:10:33Z

src/components/shared/Svg.css

 }

+.domain.debuggee {
+  fill: lightgreen;


var(--theme-toolbar-highlighted-color) ?

…nd uncomputed memberexpressions

…ols#4427) * Update PaneToggle.css * Update Tabs.css * fix for dynamic width * error check for no element * moving ui related utilities to utils/ui file * adding export to each function

…eakpoint

…t-sidebar-on-pause-at-breakpoint fix firefox-devtools#4471 - expand the right sidebar on pausing at breakpoint

Fix for firefox-devtools#4469 Right-click in editor window shows 2 context menus

Move workflow to pr docs

* Update Pause Semantics

…efox-devtools#4487)

* Add gitattributes * fix: Multi-platform and configuration issues This configures all systems to checkout and use LF line endings. The jest test system also runs without colors by default now. This allows the tests to pass in any environment regardless of color scheme. * tweaks

bump mochi

…nel_weirdness Close ConditionalPanel on blur

Slack travis

There were some race issues with the quick open mochitest assertions that this cleared up.

Added some tips to the mochitest debugging docs based on experience debugging race issue. Also Prettier fixed some things.

…pen-mochi Fix quick open mochi

…SS Styles (firefox-devtools#4502)

…ools#4514)

* add terminology * Update terminology.md

wldcordeiro · 2017-10-30T06:19:32Z

Uh oh, this looks like it needs a rebase. It's gotten a lot of additional commits on it that aren't part of the PR.

jasonLaster · 2017-10-30T13:15:56Z

I feel like this pr got stuck in the proverbial git mud, so i cherrypicked the good stuff and put it in a new PR #4536

@svitlana-galianova you're still the author of the new PR's commit. Thanks for the hard work while we figured out what to do here.

flodolo · 2017-10-30T13:44:01Z

Passing by comment: it looks like you have worked directly on the master branch of your fork. Sadly, when using a fork, things will become unmanageable really fast, especially on a repository with a lot of changes like Debugger.

The safest workflow is to keep your master in sync with the original repository's master, and create a branch to work on pull requests. At that point, if needed, you'd only need to rebase your branch against master.

Once you have completed all the pending work, my personal suggestion would be to "reset" your master and sync it with this repository's master, so you have a clean starting point for future work.

git checkout master
git remote add upstream https://github.com/devtools-html/debugger.html
git fetch upstream
git reset --hard origin/upstream
git push -f

svitlana-galianova and others added 4 commits October 19, 2017 15:20

test

9183e6b

added style to debuggee domain (firefox-devtools#4259)

afc6c8b

Merge branch 'master' of https://github.com/svitlana-galianova/debugg…

5417a5d

…er.html

Blackboxed sources distinguished by icon in source tree (firefox-devt…

1ded193

…ools#4441)

wldcordeiro reviewed Oct 22, 2017

View reviewed changes

wldcordeiro approved these changes Oct 22, 2017

View reviewed changes

nt1m reviewed Oct 22, 2017

View reviewed changes

nyrosmith and others added 21 commits October 22, 2017 16:20

Highlight errors in editor

edc9df9

fix css linting errors

e477446

add the computed property to allow differentiating between computed a…

4a3a5bb

…nd uncomputed memberexpressions

cleanup

dd340ed

Make error background color lighter

6a95a34

Fixes 3846 Source Tabs and Gutter Column Don't Line Up (firefox-devto…

3db76c5

…ols#4427) * Update PaneToggle.css * Update Tabs.css * fix for dynamic width * error check for no element * moving ui related utilities to utils/ui file * adding export to each function

fix flow

e44d0ba

event stopped for context menu for non firefox browsers

67e181e

Merge branch 'master' into bug-4469

56929e9

fix firefox-devtools#4471 - expand the right sidebar on pausing at br…

48dbf0a

…eakpoint

refactoring

94bf827

event prevent default moved

c65aea6

move the func to a utility file

01116fb

Update README.md

8c26647

added tests

b070d50

fix tests

b0b7cb8

Merge pull request firefox-devtools#4473 from leibale/expend-the-righ…

4dd3479

…t-sidebar-on-pause-at-breakpoint fix firefox-devtools#4471 - expand the right sidebar on pausing at breakpoint

Fix footer background length in dark theme

c5aed09

Merge pull request firefox-devtools#4470 from jainsneha23/bug-4469

feab364

Fix for firefox-devtools#4469 Right-click in editor window shows 2 context menus

Add next.js to framework frames (firefox-devtools#4476)

cd97e1c

changed indexOf() to includes()

e59878a

wldcordeiro and others added 10 commits October 25, 2017 08:23

Merge pull request firefox-devtools#4484 from jasonLaster/workflow

e924c3e

Move workflow to pr docs

(wip) Refactor pause actions (firefox-devtools#4439)

cb86faa

* Update Pause Semantics

[Issue-4486]-Changing the overflow rule of secondaryPanel to pr… (fir…

95dfa43

…efox-devtools#4487)

QuickOpenModal (firefox-devtools#4464)

a4ed333

bump mochi

7c73fb8

Merge pull request firefox-devtools#4491 from jasonLaster/bump-mochi

f503891

bump mochi

Merge pull request firefox-devtools#4483 from nyrosmith/ConditionalPa…

965294a

…nel_weirdness Close ConditionalPanel on blur

[Preview] Some lines are incorrectly marked as out of scope

3f579fb

Add travis notifications

fa116c7

jasonLaster added the 📚 pr-needs-review label Oct 26, 2017

wldcordeiro and others added 13 commits October 26, 2017 12:02

Merge pull request firefox-devtools#4500 from jasonLaster/slack-travis

9d6062e

Slack travis

🐛: Fix the quick-open mochitest

90aa28b

There were some race issues with the quick open mochitest assertions that this cleared up.

📝: Add some mochitest debugging tips.

b616c6c

Added some tips to the mochitest debugging docs based on experience debugging race issue. Also Prettier fixed some things.

tweaks

96777b5

Merge pull request firefox-devtools#4496 from wldcordeiro/fix-quick-o…

0fa40b8

…pen-mochi Fix quick open mochi

Weekly Post - 10-24 (firefox-devtools#4494)

cdd38e0

Remove createClass and Proptypes warning (firefox-devtools#4510)

7195dfd

(firefox-devtools#4350) Converted Step Button SVG's to images using C…

81fa049

…SS Styles (firefox-devtools#4502)

notify on failure (firefox-devtools#4511)

7f2516a

Fixes firefox-devtools#4505 - Convert file SVG to image (firefox-devt…

a0183f3

…ools#4514)

add terminology (firefox-devtools#4512)

bb4725b

* add terminology * Update terminology.md

fix l10n label (firefox-devtools#4518)

34cbf8c

changed img to svg

6de1a52

svitlana-galianova requested a review from flodolo as a code owner October 29, 2017 16:20

merged file

ca871b5

jasonLaster closed this Oct 30, 2017

[SourcesTree] Style debuggee URL domain #4463

[SourcesTree] Style debuggee URL domain #4463

Uh oh!

Conversation

svitlana-galianova commented Oct 21, 2017

Summary of Changes

Test Plan

Screenshots/Videos (OPTIONAL)

Uh oh!

James300 commented Oct 22, 2017

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

wldcordeiro left a comment

Choose a reason for hiding this comment

Uh oh!

svitlana-galianova commented Oct 22, 2017

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

codehag Oct 23, 2017 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

wldcordeiro commented Oct 30, 2017

Uh oh!

jasonLaster commented Oct 30, 2017

Uh oh!

flodolo commented Oct 30, 2017 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

17 participants

codehag Oct 23, 2017 •

edited

Loading

flodolo commented Oct 30, 2017 •

edited

Loading