Julian Descottes [:jdescottes] Assignee
	Description • 7 years ago

When collapsing a node in the markup view, it looks like the node is empty, except for the collapse toggle displayed on the left of the node. See the attachment.

We should display a hint between the opening and closing tag so that users can quickly see that the node is not empty.

Chrome for instance displays an ellipsis character (which can not really be distinguished from an actual node containing an ellipsis character).

	Gabriel Luong [:gl] (ΦωΦ)
	Comment 4 • 7 years ago
mozreview-review

Comment on attachment 8818321 [details]
Bug 1323193 - markupview: show an ellipsis character in collapsed nodes;

https://reviewboard.mozilla.org/r/98418/#review99220

This is very nice!

	Julian Descottes [:jdescottes] Assignee
	Comment 5 • 7 years ago

Thanks for the review Gabriel! Try is green (https://treeherder.mozilla.org/#/jobs?repo=try&revision=8107d2f7d6766565df81eaa019f094c75da91f86).

Landing.

	Pulsebot
	Comment 6 • 7 years ago

Pushed by jdescottes@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/333f5945aad4
markupview: show an ellipsis character in collapsed nodes;r=gl

	Julian Descottes [:jdescottes] Assignee
	Comment 7 • 7 years ago

Filter on CLIMBING SHOES

	Carsten Book [:Tomcat]
	Comment 8 • 7 years ago
bugherder

https://hg.mozilla.org/mozilla-central/rev/333f5945aad4

	magicp
	Comment 9 • 7 years ago

FYI, There is duplicate semicolon at the end of line "color: var(--theme-body-color-inactive)" in markup.css. 

[markup.css]
.expandable.collapsed .close::before {
  /* Display an ellipsis character in collapsed nodes that can be expanded. */
  content: "\2026";
  display: inline-block;
  width: 12px;
  height: 8px;
  margin: 0 2px;
  line-height: 3px;
  color: var(--theme-body-color-inactive);;
  border-radius: 3px;
  border-style: solid;
  border-width: 1px;
  text-align: center;
  vertical-align: middle;
}

	Pulsebot
	Comment 10 • 7 years ago

Pushed by jdescottes@mozilla.com:
https://hg.mozilla.org/integration/mozilla-inbound/rev/36d350615b25
remove extra semi-colon in markup.css;r=me

	Julian Descottes [:jdescottes] Assignee
	Comment 11 • 7 years ago

Thanks magicp! Fixed the nit on inbound.

	Ryan VanderMeulen [:RyanVM]
	Comment 13 • 7 years ago
bugherder

https://hg.mozilla.org/mozilla-central/rev/36d350615b25

	Sajedul Islam
	Comment 14 • 7 years ago

I have reproduced this bug with Nightly  53.0a1 (2016-12-13) on Windows 8.1 , 64 Bit ! 

Build   ID    20161213030215
User Agent    Mozilla/5.0 (Windows NT 6.3; WOW64; rv:53.0) Gecko/20100101 Firefox/53.0

This bug's fix is Verified with latest Nightly !

Build   ID    20161227030213
User Agent    Mozilla/5.0 (Windows NT 6.3; WOW64; rv:53.0) Gecko/20100101 Firefox/53.0

[bugday-20161221]

	Sebastian Zartner [:sebo]
	Comment 15 • 7 years ago

Regarding comment 14 I've set this to verified.

I've also added a note about this to the documentation:
https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#HTML_tree

Sebastian