Google групе више не подржавају нове Usenet постове ни праћења. Претходни садржај остаје видљив.

Is there a better way to print a node only

23 прегледа
Пређи на прву непрочитану поруку

Ben Kim

непрочитано,
10. 7. 2017. 08:28:4310.7.17.
– mozilla-dev-d...@lists.mozilla.org
Hi


I occasionally need to print web pages that do not provide printable css. If they are wide (having multiple columns), the page is printed over several sheets and is very disorganized.
So I usually do:
1. hit F12 and select the content div only.
2. From context menu in dev tool, "copy > innser html".
3. Then go to the <body> tag.
4. Do "paste > inner html".

This usually gives me a printable page without side menus.

My question is, is there a better way to do this?

Also, I'd like to submit a request for a context menu that has "make this the only node in the document".


Thanks,
Ben

Patrick Brosset

непрочитано,
10. 7. 2017. 08:34:3110.7.17.
– Ben Kim, mozilla-dev-d...@lists.mozilla.org
I've done similar things in the past. My workflow was a bit different
though, I would usually select the unwanted elements and press DEL on my
keyboard, to delete them.
Your solution seems better because you do this in one go.

I like your idea about having a "make this the only node in the document".
In a way this reminds me of a somewhat regularly request feature to
"extract" a node from a page in order to create a simple HTML/CSS test case
that can stand on its own, without being part of the larger page. This has
some complexity to it since you need to get the CSS rules to keep on
matching correctly even though the DOM is different.

Having this would be great for creating reduced test cases and should
answer your need to print the content in web pages.

Maybe others have better ideas for this though?

Patrick
> _______________________________________________
> dev-developer-tools mailing list
> dev-devel...@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-developer-tools
>

Nicolas Chevobbe

непрочитано,
10. 7. 2017. 08:46:4610.7.17.
– Patrick Brosset, Ben Kim, mozilla-dev-d...@lists.mozilla.org
Chris Coyer created a bookmarklet that allows to remove unwanted element
from a page quite fast : https://css-tricks.github.io/The-Printliminator/ .
I guess in you test case it might involve multiple clicks, but I guess it
would be faster than your current workflow.

On Mon, Jul 10, 2017 at 2:34 PM, Patrick Brosset <pbro...@mozilla.com>
wrote:

Mike Taylor

непрочитано,
10. 7. 2017. 11:26:3910.7.17.
– Patrick Brosset, Ben Kim, mozilla-dev-d...@lists.mozilla.org
On 7/10/17 7:34 AM, Patrick Brosset wrote:
> I like your idea about having a "make this the only node in the document".
> In a way this reminds me of a somewhat regularly request feature to
> "extract" a node from a page in order to create a simple HTML/CSS test case
> that can stand on its own, without being part of the larger page. This has
> some complexity to it since you need to get the CSS rules to keep on
> matching correctly even though the DOM is different.
>
> Having this would be great for creating reduced test cases and should
> answer your need to print the content in web pages.

I frequently use the Chrome DevTools SnappySnippet to extract the
selected node into a codepen/jsbin for reduced test cases:

https://github.com/kdzwinel/SnappySnippet

I'd love for something like this to exist in Fx DevTools.

--
Mike Taylor
Web Compat, Mozilla

Patrick Brosset

непрочитано,
11. 7. 2017. 03:40:2311.7.17.
– Mike Taylor, Ben Kim, mozilla-dev-d...@lists.mozilla.org
Yeah, that would be great! Thanks for sharing this Mike.

I tried running the extension in Firefox, it does show up, but there's an
API we haven't yet implemented so snippets can't be created.
I filed an issue on Konrad's repo:
https://github.com/kdzwinel/SnappySnippet/issues/53

Patrick

Julien Wajsberg

непрочитано,
11. 7. 2017. 05:45:2411.7.17.
– dev-devel...@lists.mozilla.org
Le 09/07/2017 à 06:33, Ben Kim a écrit :
> Hi
>
>
> I occasionally need to print web pages that do not provide printable css. If they are wide (having multiple columns), the page is printed over several sheets and is very disorganized.
> So I usually do:
> 1. hit F12 and select the content div only.
> 2. From context menu in dev tool, "copy > innser html".
> 3. Then go to the <body> tag.
> 4. Do "paste > inner html".
>
> This usually gives me a printable page without side menus.
>
> My question is, is there a better way to do this?
>
>


Actually, Firefox has a function where you can print only a selection of
the page.

Here is what I do:

1. Select the part of the page I'm interested in.
2. Select "file > print" from the menu.
3. Select "selection"

The downside is that Firefox tries to preserve the general layout of the
page, which is not really helpful. So sometimes it won't give you the
desired result ;)

DL Neil

непрочитано,
11. 7. 2017. 18:03:3411.7.17.
– Patrick Brosset, Ben Kim, mozilla-dev-d...@lists.mozilla.org
On 11/07/17 00:34, Patrick Brosset wrote:
> I've done similar things in the past. My workflow was a bit different
> though, I would usually select the unwanted elements and press DEL on my
> keyboard, to delete them.
> Your solution seems better because you do this in one go.
>
> I like your idea about having a "make this the only node in the document".
> In a way this reminds me of a somewhat regularly request feature to
> "extract" a node from a page in order to create a simple HTML/CSS test case
> that can stand on its own, without being part of the larger page. This has
> some complexity to it since you need to get the CSS rules to keep on
> matching correctly even though the DOM is different.
>
> Having this would be great for creating reduced test cases and should
> answer your need to print the content in web pages.
>
> Maybe others have better ideas for this though?
> Patrick


Of possible interest is the PrintPDF Add-on/Extension - it allows a
choice of output to printer or PDF AFTER editing elements 'off' the page:

PrintPDF :: Add-ons for Firefox
PrintPDF 0.76.1-signed.1-signed Requires Restart
by Stuart Parmenter
https://addons.mozilla.org/en-US/firefox/addon/printpdf/?src=api

NB haven't tried the Chris Coyer snippet to be able to compare/contrast


--
Regards,
=dn

Ben Kim

непрочитано,
18. 7. 2017. 03:38:5418.7.17.
– DL Neil, mozilla-dev-d...@lists.mozilla.org, Patrick Brosset
Thanks for the great responses. I tried Printliminator and was happy with
it. It actually allows "alt + click" to remove all "other" elements than
selected, so it is almost a one click business.
I don't usually keep the bookmark bar open so would be happy to see
something similar in the dev tool context menu.
But I am glad to have learned about available options.


On Tue, Jul 11, 2017 at 5:02 PM, DL Neil <MozDe...@getaroundtoit.co.uk>
wrote:
0 нових порука