Comment ouvrir les outils de développement Chrome dans une nouvelle fenêtre?

250

Lorsque j'essaie d'utiliser les outils de développement Chrome, il semble que je ne puisse plus l'afficher dans une nouvelle fenêtre.

Est-ce un bug ou était-ce vraiment un changement prévu dans une mise à jour?

Comment ouvrir les outils de développement Chrome dans une nouvelle fenêtre?

Voici une capture d'écran de ce dont je parle.

entrez la description de l'image ici

Abel Callejo
la source
11
@AbelMelquiadesCallejo Vous devez cliquer et maintenir pour que l'option se révèle.
katalin_2003
2
Hey Side note, sur une boîte Linux ici et j'ai dû tenir longtemps avec le bouton gauche de la souris, puis cliquer avec la molette de la souris pour obtenir le désamarrage.
Bob Barker
pour de vrai je me souviens du bouton facile, mais maintenant c'est ridicule que j'ai forcé à google comment le faire.
alexander_ch

Réponses:

426

Depuis Chrome 52, l'interface utilisateur a changé. Lorsque la boîte de dialogue Outils de développement est ouverte, vous sélectionnez les points de suspension verticaux et pouvez ensuite choisir la position d'ancrage:

entrez la description de l'image ici

Sélectionnez l'icône à gauche pour ouvrir les outils de développement Chrome dans une nouvelle fenêtre: icône de plusieurs fenêtres


Précédemment

Cliquez et maintenez le bouton à côté du bouton de fermeture de l'outil de développeur afin de révéler l'option "Détacher dans une fenêtre séparée".

entrez la description de l'image ici

Remarque: Une "presse" ne suffit pas dans cet état.

Kyle Hale
la source
18
Une «presse» ne suffit pas dans cet état. Vous devez cliquer et maintenir le bouton (à gauche du bouton de fermeture) afin de révéler l'option "Déverrouiller dans une fenêtre séparée".
katalin_2003
5
Oui, click and hold(j'utilise Chrome pour Windows, version 39.x pour x64).
Do Nhu Vy
5
Existe-t-il un moyen de toujours ouvrir dans une nouvelle fenêtre? Il y avait une option avant mais ne peut pas trouver dans 39.0.2171.95.
user3285954
94
Quelle terrible décision d'interface utilisateur; Je ne suis pas sûr que cela pourrait être plus introuvable. Merci pour le conseil!
Joshua Jabbour
2
À partir de la mi-2016, il vous suffit de cliquer sur les ellipses verticales pour que les options d'ancrage apparaissent, vous n'avez plus besoin de cliquer et de maintenir.
Chris B
8

entrez la description de l'image ici

  1. cliquez sur trois points en haut à droite ->
  2. cliquez sur l'icône "Détacher dans une fenêtre séparée"
фымышонок
la source
3

Vous devez cliquer et maintenir jusqu'à ce que l'autre icône apparaisse, puis faites glisser la souris vers le bas jusqu'à l'icône.

user1585204
la source
1

Tapez simplement ctrl + shift + I dans google chrome et vous atterrirez dans une fenêtre de développeur isolée.

bulkyPanda
la source
5
cela ne fonctionne que si votre chrome-developer-tools était déjà configuré pour s'ouvrir dans une nouvelle fenêtre
Abel Callejo
1

Si vous devez ouvrir les DevTools, appuyez sur ctrl-shift-i .

Si la fenêtre DevTools est déjà ouverte, vous pouvez utiliser le raccourci ctrl-shift-d ; il fait basculer la fenêtre dans un mode détaché.

Par exemple, dans mon cas, la fenêtre d'application d'électrons (Chrome) est vraiment petite.

entrez la description de l'image ici

Il n'est pas possible d'utiliser d'autres suggestions à l'exception du raccourci ctrl-shift-d

Roman Podlinov
la source
Je viens d'essayer cette réponse et elle semble bien fonctionner sous Windows. Je l'ai également essayé sur Mac, mais les raccourcis sont différents. Ouvrez les DevTools ( cmd + option + i ) et passez à l'autre côté du dock ( cmd + shift + d ). Également sur Mac, en utilisant directement cmd + shift + dw / o en premier, les DevTools céderaient à une fonctionnalité différente.
Abel Callejo