Pesquisar no site de suporte

Evite golpes de suporte. Nunca pedimos que você ligue ou envie uma mensagem de texto para um número de telefone, ou compartilhe informações pessoais. Denuncie atividades suspeitas usando a opção “Denunciar abuso”.

Saiba mais

Esta discussão foi arquivada. Faça uma nova pergunta se precisa de ajuda.

How can I emulate media queries after Developer Toolbar has been removed?

  • 11 respostas
  • 1 tem este problema
  • 2 visualizações
  • Última resposta de Alman

more options

The title says it all:

After the Developer Toolbar has been removed in Firefox v62, how do I emulate media queries, like "print"? And how do I reset this setting?

Just for your information in case your are in doubt about my question: While the Developer Toolbar was active, the Developer Toolbar command for setting media emulation to print was "media emulate print". The command for resetting the media type was "media reset".

Your answer is appreciated.

The title says it all: After the Developer Toolbar has been removed in Firefox v62, how do I emulate media queries, like "print"? And how do I reset this setting? Just for your information in case your are in doubt about my question: While the Developer Toolbar was active, the Developer Toolbar command for setting media emulation to print was "media emulate print". The command for resetting the media type was "media reset". Your answer is appreciated.

Alterado por Alman em

Todas as respostas (11)

more options

There might be an alternative available.

I think that if you select a specific @media rule in the Style Editor that Firefox would render the page with these rules. This would only work if the website has @media rules.

more options

Hi Alman, while this feature is on hiatus, a possible workaround is to run a script in the Web Console that flips the media properties so the screen display shows print output. I posted some initial functions here and would appreciate your testing and commenting on them:

https://gist.github.com/jscher2000/f29d5d12713fa9afb40029bdb55e9c99

Thread for input to the developers: https://discourse.mozilla.org/t/how-to-media-emulate-print-without-developer-toolbar-gcli/30975 (Oh, I think you found this one already)

Alterado por jscher2000 - Support Volunteer em

more options

Thanks! I appreciate your answers.

I'll check for the workarounds on the GitLab documentation and see how they behave.

But, the best solution would be to be able to emulate any kind of device again.

more options

cor-el said

There might be an alternative available. I think that if you select a specific @media rule in the Style Editor that Firefox would render the page with these rules. This would only work if the website has @media rules.

Nope, doesn't work (Firefox 64).

more options

jscher2000 said

Hi Alman, while this feature is on hiatus, a possible workaround is to run a script in the Web Console ...

Doesn't work on my machine. Get a security exception (see image attached).

Alterado por Alman em

more options

Alman said

Doesn't work on my machine. Get a security exception (see image attached).

Hmm, can you share a link to a page where you see that problem?

more options

jscher2000 said

Alman said
Doesn't work on my machine. Get a security exception (see image attached).

Hmm, can you share a link to a page where you see that problem?

Sure. I'll be glad to: https://about.gitlab.com/

more options

Alman said

jscher2000 said
Hmm, can you share a link to a page where you see that problem?

Sure. I'll be glad to: https://about.gitlab.com/

Um, hmm, the first style sheet is from Google Fonts, and this gives a security error:

document.styleSheets[0].cssRules

The second style sheet is from FontAwesome and that works fine. I notice its link tag has crossorigin="anonymous", which the first one doesn't have, so perhaps that explains the difference. But maybe not. The error message doesn't have enough detail.

What a headache. I think the only way around is try/catch but maybe a programmer knows better than I do.

more options

Okay, I revised the script to log those errors to the console. Since you seem to be using this more than me, perhaps you'll spot a pattern to it.

https://gist.github.com/jscher2000/f29d5d12713fa9afb40029bdb55e9c99

more options

You may have to create a third-party cookie exception for some involved domains to avoid such cross domain security errors. You can temporarily try to enable all third-party cookies to see if that makes it work and for what domains cookies are created. See also the Storage Inspector.

Some websites can also use CSP rules that prevent scripts from working properly.

more options

So, it looks to be kind of much workload for Jefferson.

Nonetheless, we need back an option to select which media type to use. Currently we cannot test whether print or speech styles apply correctly.

I still suggest to add a ComboBox to Developer Tools: