Have questions about images on the web? Tweet your questions to @ChromiumDev with #AskChrome and we'll answer the top questions in our next #AskChrome episode on YouTube.

Menggunakan Fitur DevTools Tanpa Membuka DevTools

Powered by Google Translate

Saya biasanya melihat pertanyaan di sepanjang baris "Saya sangat suka fitur X DevTools, tetapi berhenti bekerja ketika saya menutup DevTools. Bagaimana cara menjaga fitur X berjalan bahkan ketika DevTools ditutup?"

Jawaban singkatnya adalah: Anda mungkin tidak bisa.

Namun, Anda * dapat * meretas skrip Puppeteer yang meluncurkan Chromium, membuka klien debug jarak jauh, lalu mengaktifkan fitur DevTools yang Anda sukai (melalui Chrome DevTools Protocol ), tanpa pernah secara eksplisit membuka DevTools.

Misalnya, skrip di bawah ini memungkinkan saya menghamparkan FPS Meter di atas kanan atas area pandang, meskipun DevTools tidak pernah terbuka, seperti yang dapat Anda lihat dalam video di bawah ini.

// Node.js version: 8.9.4
const puppeteer = require('puppeteer'); // version 1.0.0

(async () => {
  // Prevent Puppeteer from showing the "Chrome is being controlled by automated test
  // software" prompt, but otherwise use Puppeteer's default args.
  const args = await puppeteer.defaultArgs().filter(flag => flag !== '--enable-automation');
  const browser = await puppeteer.launch({
    headless: false,
    ignoreDefaultArgs: true,
    args
  });
  const page = await browser.newPage();
  const devtoolsProtocolClient = await page.target().createCDPSession();
  await devtoolsProtocolClient.send('Overlay.setShowFPSCounter', { show: true });
  await page.goto('https://developers.google.com/web/tools/chrome-devtools');
})();

Ini hanyalah salah satu dari sekian banyak fitur DevTools yang dapat Anda akses secara potensial melalui Chrome DevTools Protocol.

Saran umum: periksa Puppeteer API sebelum beralih ke membuat klien Protokol DevTools. Dalang sudah memiliki API khusus untuk banyak fitur DevTools, seperti code coverage dan intercepting Console messages .

Jika Anda membutuhkan bantuan mengakses fitur DevTools melalui Puppeteer, ask a question on Stack Overflow .

Jika Anda ingin memamerkan skrip Puppeteer yang memanfaatkan Protokol DevTools, tweet kami di @ChromeDevTools .

rss_feed Subscribe to our RSS or Atom feed and get the latest updates in your favorite feed reader!