Hızlı Başlangıç: Microsoft Playwright Testing Preview ile test sorunlarını giderme

Bu hızlı başlangıçta, Microsoft Playwright Testing Preview'da yayımlanan raporları ve yapıtları kullanarak Playwright testlerinizin sorunlarını kolayca gidermeyi öğreneceksiniz. Ayrıca bu kılavuz, hizmet tarafından sağlanan bulutta barındırılan tarayıcılarda test çalıştırıp çalıştırmadığınıza bakılmaksızın raporlama özelliğini nasıl kullanabileceğinizi gösterir.

Bu hızlı başlangıcı tamamladıktan sonra, hizmet portalında test sonuçlarını ve yapıtlarını görüntülemek için bir Microsoft Playwright Testing çalışma alanınız olacak.

Background

Microsoft Playwright Testing hizmeti şunları sağlar:

• Bulutta barındırılan tarayıcıları kullanarak testleri paralel çalıştırarak derleme işlem hatlarını hızlandırın.
• Hizmette test sonuçları ve yapıtlar yayımlayarak sorun gidermeyi basitleştirin ve bunları hizmet portalından erişilebilir hale getirebilirsiniz.

Hizmetin bu iki özelliği birbirinden bağımsız olarak kullanılabilir ve her birinin kendi fiyatlandırma planı vardır. Başka bir deyişle:

• Test çalıştırmalarını hızlandırın ve testleri bulutta barındırılan tarayıcılarda çalıştırarak ve sonuçları hizmete yayımlayarak sorun gidermeyi kolaylaştırın.
• Test çalıştırmalarını daha hızlı tamamlamak için testleri yalnızca bulutta barındırılan tarayıcılarda çalıştırın.
• Etkili sorun giderme için testleri yerel olarak çalıştırmaya devam ederken test sonuçlarını hizmette yayımlayın.

Önkoşullar

• Etkin aboneliği olan bir Azure hesabı. Azure aboneliğiniz yoksa başlamadan önce ücretsiz bir hesap oluşturun.
• Azure hesabınızın Sahip, Katkıda Bulunan veya klasik yönetici rollerinden birine ihtiyacı vardır.
• Bir Playwright projesi. Projeniz yoksa Playwright kullanmaya başlama belgelerini kullanarak bir proje oluşturun veya Microsoft Playwright Testing örnek projemizi kullanın.
• Azure CLI. Azure CLI'nız yoksa bkz . Azure CLI'yı yükleme.

Çalışma alanı oluşturma

Playwright Testing hizmetinde test sonuçlarını yayımlamaya başlamak için önce Playwright portalında bir Microsoft Playwright Testing çalışma alanı oluşturun.

1. Azure hesabınızla Playwright portalında oturum açın.

2. Zaten bir çalışma alanınız varsa var olan bir çalışma alanını seçin ve sonraki adıma geçin.

   İpucu

   Birden çok çalışma alanınız varsa, sayfanın üst kısmındaki çalışma alanı adını seçip Tüm çalışma alanlarını yönet'i seçerek başka bir çalışma alanına geçebilirsiniz.

3. Henüz bir çalışma alanınız yoksa + Yeni çalışma alanı'nı seçin ve aşağıdaki bilgileri sağlayın:

   Alan	Açıklama
   Çalışma alanı adı	Çalışma alanınızı tanımlamak için benzersiz bir ad girin. Ad yalnızca alfasayısal karakterlerden oluşabilir ve uzunluğu 3 ile 64 karakter arasında olabilir.
   Azure Aboneliği	Bu Microsoft Playwright Testing çalışma alanı için kullanmak istediğiniz Azure aboneliğini seçin.
   Bölge	Çalışma alanınızı barındırmak için coğrafi bir konum seçin. Bu, çalışma alanı için test çalıştırması verilerinin depolandığı konumdur.

   

4. Aboneliğinizde çalışma alanı oluşturmak için Çalışma alanı oluştur'u seçin.

   Çalışma alanı oluşturma sırasında, Azure aboneliğinizde yeni bir kaynak grubu ve Microsoft Playwright Testing Azure kaynağı oluşturulur.

Çalışma alanı oluşturma işlemi tamamlandığında kurulum kılavuzuna yönlendirilirsiniz.

Microsoft Playwright Testing paketini yükleme

Hizmeti kullanmak için Microsoft Playwright Testing paketini yükleyin.

npm init @azure/microsoft-playwright-testing

Bu komut aşağıdakilere playwright.service.config.ts hizmet eden bir dosya oluşturur:

• Playwright istemcinizi Microsoft Playwright Testing hizmetine yönlendirin ve kimlik doğrulamasından geçin.
• Test sonuçlarını ve yapıtlarını yayımlamak için bir muhabir ekler.

Bu dosyaya zaten sahipseniz, istem sizden dosyayı geçersiz kılmanızı ister.

Test çalıştırmasında yalnızca raporlama özelliğini kullanmak için false olarak ayarlayarak useCloudHostedBrowsers bulutta barındırılan tarayıcıları devre dışı bırakın.

export default defineConfig(
  config,
  getServiceConfig(config, {
    timeout: 30000,
    os: ServiceOS.LINUX,
	useCloudHostedBrowsers: false // Do not use cloud hosted browsers
  }),
  {
    reporter: [['list'], ['@azure/microsoft-playwright-testing/reporter']], // Reporter for Microsoft Playwright Testing service
  }
);

değeri olarak false ayarlamak, bulutta barındırılan tarayıcıların testleri çalıştırmak için kullanılmamasını sağlar. Testler yerel makinenizde çalışır, ancak sonuçlar ve yapıtlar hizmette yayımlanır.

Hizmet bölgesi uç noktasını yapılandırma

Kurulumunuzda bölgeye özgü hizmet uç noktasını sağlamanız gerekir. Uç nokta, çalışma alanını oluştururken seçtiğiniz Azure bölgesine bağlıdır.

Hizmet uç noktası URL'sini almak için:

1. Kurulumunuzda bölge uç noktası ekle bölümünde, çalışma alanınız için bölge uç noktasını kopyalayın.

   Uç nokta URL'si, çalışma alanını oluştururken seçtiğiniz Azure bölgesiyle eşleşir.

   

Ortamınızı ayarlama

Ortamınızı ayarlamak için ortam değişkenini PLAYWRIGHT_SERVICE_URL önceki adımlarda elde ettiğiniz değerle yapılandırmanız gerekir.

Ortamınızı yönetmek için modülünü dotenv kullanmanızı öneririz. ile dotenv, dosyasında ortam değişkenlerinizi .env tanımlarsınız.

1. dotenv Modülü projenize ekleyin:

   npm i --save-dev dotenv
   

2. Playwright projenizde dosyanın yanında playwright.config.ts bir .env dosya oluşturun:

   PLAYWRIGHT_SERVICE_URL={MY-REGION-ENDPOINT}
   

   Metin yer tutucusunun {MY-REGION-ENDPOINT} yerine daha önce kopyaladığınız değeri eklediğinizden emin olun.

Kimlik doğrulaması kurulumu

Test sonuçlarını ve yapıtları Microsoft Playwright Testing çalışma alanınızda yayımlamak için, testleri hizmetle çalıştırdığınız Playwright istemcisinin kimliğini doğrulamanız gerekir. İstemci, yerel geliştirme makineniz veya CI makineniz olabilir.

Hizmet iki kimlik doğrulama yöntemi sunar: Microsoft Entra Id ve Access Tokens.

Microsoft Entra Id, Güvenli erişim için Azure hesabınızda oturum açmayı gerektiren Azure kimlik bilgilerinizi kullanır. Alternatif olarak, Playwright çalışma alanınızdan bir erişim belirteci oluşturabilir ve bunu kurulumunuzda kullanabilirsiniz.

Microsoft Entra Id kullanarak kimlik doğrulamayı ayarlama

Microsoft Entra Id, hizmet için varsayılan ve önerilen kimlik doğrulamasıdır. Yerel geliştirme makinenizden Oturum açmak için Azure CLI'yı kullanabilirsiniz

az login

Erişim belirteçlerini kullanarak kimlik doğrulamayı ayarlama

Playwright Testing çalışma alanınızdan bir erişim belirteci oluşturabilir ve bunu kurulumunuzda kullanabilirsiniz. Ancak, gelişmiş güvenliği nedeniyle kimlik doğrulaması için Microsoft Entra Id'yi kesinlikle öneririz. Erişim belirteçleri kullanışlı olsa da uzun ömürlü parolalar gibi çalışır ve güvenliğin tehlikeye atılmasına daha duyarlıdır.

1. Erişim belirteçleri kullanılarak kimlik doğrulaması varsayılan olarak devre dışı bırakılır. Kullanmak için Erişim belirteci tabanlı kimlik doğrulamasını etkinleştir

2. Erişim belirteçlerini kullanarak kimlik doğrulamayı ayarlama

Playwright yapılandırmasında yapıtları etkinleştirme

playwright.config.ts Projenizin dosyasında gerekli tüm yapıtları topladığınızdan emin olun.

  use: {
    trace: 'on-first-retry',
    video:'retain-on-failure',
    screenshot:'on'
  },

Microsoft Playwright Testing'te testlerinizi çalıştırma ve sonuçları yayımlama

Microsoft Playwright Testing ile test sonuçlarını ve yapıtlarını yayımlamak için yapılandırmayı hazırladınız. Yeni oluşturulan playwright.service.config.ts dosyayı kullanarak testleri çalıştırın ve test sonuçlarını ve yapıtlarını hizmette yayımlayın.

   npx playwright test --config=playwright.service.config.ts

Test tamamlandıktan sonra terminalde test durumunu görüntüleyebilirsiniz.

Running 6 test using 2 worker
    5 passed, 1 failed (20.2s)
    
Test report: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>

Playwright portalında test çalıştırmalarını ve sonuçlarını görüntüleme

Artık Playwright portalında başarısız test çalışmalarının sorunlarını giderebilirsiniz.

1. Test çalıştırmanız tamamlandıktan sonra Playwright Portalı'na bir bağlantı oluşturulur. Ayrıntılı test sonuçlarını ve ilişkili yapıtları görüntülemek için bu bağlantıyı açın. Portalda aşağıdakiler dahil olmak üzere temel bilgiler görüntülenir:

   • CI derleme ayrıntıları
   • Genel test çalıştırması durumu
   • Test çalıştırmasına bağlı işleme kimliği

   

2. Playwright portalı sorun giderme için gerekli tüm bilgileri sağlar. Şunları yapabilirsiniz:

   • Yeniden denemeler arasında geçiş yapma.
   • Ekran görüntüleri veya videolar gibi ayrıntılı hata günlüklerini, test adımlarını ve ekli yapıtları görüntüleyin.
   • Daha ayrıntılı analiz için doğrudan İzleme Görüntüleyicisi'ne gidin.

   

3. İzleme Görüntüleyicisi, test yürütme işleminizde görsel olarak adım adım ilerleyebilirsiniz. Şunları yapabilirsiniz:

   • Tek tek adımların üzerine gelerek her eylemden önceki ve sonraki sayfa durumunu göstermek için zaman çizelgesini kullanın.
   • Her adım için ayrıntılı günlükleri, DOM anlık görüntülerini, ağ etkinliğini, hataları ve konsol çıkışını inceleyin.

   

Sonraki adım

Playwright portalında bir Microsoft Playwright Testing çalışma alanını başarıyla oluşturdunuz ve Playwright testlerinizi bulut tarayıcılarında çalıştırabilirsiniz.

CI/CD iş akışınızda Playwright testlerinizi çalıştırarak sürekli uçtan uca test ayarlamak için sonraki hızlı başlangıçta ilerleyin.