Tire uma captura de tela de página inteira com o Firefox na linha de comando

224

Estou executando o Firefox em um Xvfb em um VPS. O que eu quero fazer é tirar uma captura de tela da página inteira.

Posso redirecionar o Firefox para uma página específica usando

firefox http://google.com

e tire uma captura de tela (dentro do X) usando o ImageMagick

import root -window output.jpg

O problema é que a maior parte da página precisa ser rolada e não sei a altura de antemão.

A outra maneira é escolher uma altura muito grande (como 4000px) e depois processar a imagem e remover a parte inútil. Mas isso é processamento desnecessário.

Encontrei muitos complementos do Firefox, mas estou procurando uma solução que possa ser programada usando a linha de comando do Shell.

Edit: Acabei escrevendo minha própria extensão FireFox para fazer isso.

shell firefox command-line screenshot Omar Abid
fonte
1
Eu já vi algumas ferramentas do CLI do webkit para tirar screenshots, mas não me lembro dos nomes.
Rufo El Magufo

Respostas:

480

A barra de ferramentas do desenvolvedor GCLI e o atalho Shift+ F2foram removidos na versão 60 do Firefox . Para tirar uma captura de tela em 60 ou mais recente:

  • pressione Ctrl+ Shift+ Kpara abrir o console do desenvolvedor ( ⌥ Option+ ⌘ Command+K no macOS)
  • tipo :screenshotou:screenshot --fullpage

Saiba mais sobre capturas de tela e outros recursos

Para versões do Firefox <60:

Pressione Shift+ F2ou vá para Ferramentas> Desenvolvedor Web> Barra de Ferramentas do Desenvolvedor para abrir uma linha de comando. Escrever:

screenshot

e pressione Enter para tirar uma captura de tela.

Para responder totalmente à pergunta, você pode até salvar a página inteira, não apenas a parte visível:

screenshot --fullpage

E para copiar a captura de tela para a área de transferência, use a --clipboardopção:

screenshot --clipboard --fullpage

Firefox 18 altera a maneira como os argumentos são transmitidos aos comandos, você deve adicionar "-" antes deles.

Você pode encontrar alguma documentação e a lista completa de comandos aqui .

PS. As capturas de tela são salvas no diretório de downloads por padrão.

Enreas
fonte
4
Se você quiser apenas copiar a captura de tela para a área de transferência, use diretamente a captura de tela --clipboard --fullpage
mbokil
2
Esse comando não funciona em um console javascript. Existe um link para mais informações sobre esta barra de ferramentas? O que mais ele pode fazer?
tremby
5
Apenas para sua informação, você também pode selecionar as notas do DOM através do inspetor e depois right-click-> screenshot node. Isso é super útil quando você deseja capturar a tela de uma seção de uma página.
Tom Tom
5
Página de ecrâ a prancheta - screenshot --clipboard --fullpageCaptura de tela de um nó particular (por ID) -screenshot --clipboard --selector #elementId
Mohnish
3
Eu tive que usar :screenshot --clipboard --fullpage(mente do cólon)
someonr
134

Atualização 2018-07-23

Como acabamos de salientar nos comentários, essa pergunta era sobre obter uma captura de tela na linha de comando . Desculpe, acabei de ler sobre isso. Então, aqui está a resposta correta:

No Firefox 57, você pode criar uma captura de tela no modo decapitado como este:

firefox -screenshot https://developer.mozilla.com

Leia mais na documentação .

Atualização 15/06/2017

No Firefox 55, existem os Screenshots do Firefox como uma alternativa mais flexível. A partir do Firefox 57, as capturas de tela também podem capturar uma página inteira.

Resposta original

Desde o Firefox 32, também há um botão de captura de tela de página inteira nas ferramentas de desenvolvedor (F12). Se não estiver ativado, vá para as configurações das ferramentas do desenvolvedor (botão de engrenagem) e escolha "Tirar uma captura de tela de página inteira" na seção "Botões disponíveis da caixa de ferramentas".

barra de ferramentas das ferramentas do desenvolvedor fonte: developer.mozilla.org

Por padrão, as capturas de tela são salvas no diretório de download. Isso funciona da mesma forma screenshot --fullpagena barra de ferramentas.

Mouagip
fonte
7
Para aqueles que abrem o Firebug no F12, as ferramentas do desenvolvedor estão disponíveis com Ctrl + Shift + K ou Ctrl + Shift + I. Apenas ... no caso ... alguém nunca os usou antes.
ken
Esses atalhos de teclado não funcionam no Mac. Use Ferramentas> Desenvolvedor Web> Ferramentas de alternância. E, sim, o botão da tela está desativado por padrão. Clique no ícone Configurações para ativar.
Snowcrash
no Mac, você pode abrir as ferramentas de desenvolvedor com cmd+ alt+i
achairapart 10/15/15
Firefox Screenshots carrega capturas de tela tiradas nos servidores da Mozilla. Eles não tornaram isso óbvio o suficiente para eu notar com antecedência. Felizmente, a imagem no meu caso não era muito sensível, embora fosse interna. Esteja avisado.
Martelo Bro.
1
Da pergunta: "Encontrei muitos complementos do Firefox, mas estou procurando uma solução que possa ser programada usando a linha de comando do Shell".
Quentin
9

Acabei codificando uma solução personalizada (extensão Firefox) que faz isso. Acho que, quando o desenvolvi, a linha de comando mencionada no Enreas não estava lá.

A extensão do Firefox é CmdShots . É uma boa opção se você precisar de um controle mais refinado sobre o processo de captura da captura de tela (ou desejar fazer algumas modificações em HTML / JS e processamento de imagem).

Você pode usá-lo e abusar dele. Decidi mantê-lo sem licença, para que você possa brincar com ele como quiser.

Omar Abid
fonte
20
Hmm, não é isso que significa "não licenciado": na verdade significa que você não dá permissão para qualquer uso, o que claramente não é verdade, pois nessa mesma frase você também diz que não há problema em usar, abusar e brincar com ele enquanto você quer. Talvez você queira algo como o CC0 ?
SamB 05/07
Para aquelas coisas "não licenciadas", eu prefiro isso: wtfpl.net Indica claramente o que é permitido sem uma BS legal.
kap
@ SamB Eu tropecei aleatoriamente em seu comentário. Sim, eu sei 3 anos depois. O problema é que, se eu escrever uma licença, já complicarei as coisas. A abordagem NOLICENSE é simplesmente fazer coisas.
Omar Abid
3
Por favor, pessoal, não use licença personalizada. Sei que as pessoas tentam evitar bobagens legais escrevendo sua própria licença, mas acabam fazendo o oposto, causando dores de cabeça legais para as pessoas enquanto tentam descobrir o que realmente significa a licença personalizada. Veja choosealicense.com
Flimm
@SamB - enquanto "não licenciado" não é explicitamente uma "licença oficial", "The Unlicense" na verdade é uma licença e parece estar bem próximo do que o OP descreve como sua intenção de usar seu código. Veja: choosealicense.com/licenses/unlicense
Will Ediger
8

Eu acho que o que você está procurando é um utilitário que permita salvar uma página completa aberta no seu navegador em um arquivo png. Provavelmente você está procurando um utilitário como commandlineprint2 .

Depois de instalar a extensão, você só precisa digitar o comando:

firefox -print http://google.com -printfile ~/foo.png
Nehal J Wani
fonte
1

Firefox Screenshots é uma nova ferramenta que acompanha o Firefox. Não é uma ferramenta de desenvolvedor, é direcionada aos usuários finais do navegador.

Para tirar uma captura de tela, clique no menu de ações da página na barra de endereço e clique em "tirar uma captura de tela". Se você clicar em "Salvar página inteira", ele salvará a página inteira, rolando para você.


(fonte: mozilla.net )

Flimm
fonte
3
Da pergunta: "Encontrei muitos complementos do Firefox, mas estou procurando uma solução que possa ser programada usando a linha de comando do Shell".
Quentin
-1

Você pode usar o selênio e o driver da web para o Firefox.

import selenium.webdriver
import selenium.common

options = selenium.webdriver.firefox.options.Options()
# options.headless = True
with selenium.webdriver.Firefox(options=options) as driver:
    driver.get('http://google.com')
    time.sleep(2)
    root=driver.find_element_by_tag_name('html')
    root.screenshot('whole page screenshot.png')
Gqqnbig
fonte