Aşağıdaki videoyu izleyerek yeni Kaydedici paneline (önizleme özelliği) göz atın.
Kaydedici panelini kullanarak kullanıcı akışlarını kaydetme, tekrar oynatma ve ölçmeyi öğrenmek için bu eğiticiyi tamamlayın.
Kaydedilen kullanıcı akışlarının nasıl paylaşılacağı ve bu akışlarla ilgili adımların nasıl paylaşılacağı hakkında daha fazla bilgi için Kaydedici özellikleri referansına göz atın.
Kaydedici panelini aç
- Geliştirici Araçları'nı açın.
Diğer seçenekler
> Diğer araçlar > Kaydedici'yi tıklayın.
Alternatif olarak, Kaydedici panelini açmak için Komut Menüsü'nü de kullanabilirsiniz.
Giriş
Bu kahve siparişi demo sayfasını kullanacağız. Ödeme, alışveriş web siteleri arasında yaygın olarak kullanılan bir kullanıcı işlemleri akışıdır.
Sonraki bölümlerde, Kaydedici paneliyle aşağıdaki ödeme akışını kaydetme, tekrar oynatma ve denetleme konusunda size yol göstereceğiz:
- Alışveriş sepetine kahve ekle.
- Alışveriş sepetine bir kahve daha ekle.
- Alışveriş sepeti sayfasına gidin.
- Alışveriş sepetinden bir kahveyi çıkarın.
- Ödeme işlemini başlatın.
- Ödeme ayrıntılarını girin.
- Ödeme yapın.
Kullanıcı işlemleri akışını kaydetme
- Bu demo sayfasını açın. Başlamak için Yeni kayıt başlat düğmesini tıklayın.
- Kayıt adı metin kutusuna "kahve ödeme" yazın.
- Yeni kayıt başlat düğmesini tıklayın. Kayıt başlatılır. Panelde, kaydın devam ettiğini belirten Kayıt yapılıyor... ifadesi görünür.
- Cappuccino'yu alışveriş sepetine eklemek için tıklayın.
- Alışveriş sepetine eklemek için Americano'yu tıklayın. Kaydedici'nin şu ana kadar uyguladığınız adımları gösterdiğine dikkat edin.
- Alışveriş sepeti sayfasına gidin ve Americano'yu alışveriş sepetinden kaldırın.
- Ödeme işlemini başlatmak için Toplam: 19,00 TL düğmesini tıklayın.
- Ödeme ayrıntıları formunda, Ad ve E-posta metin kutularını doldurun ve Sipariş güncellemelerini ve tanıtım mesajlarını almak istiyorum onay kutusunu işaretleyin.
- Ödeme işlemini tamamlamak için Gönder düğmesini tıklayın.
- Kaydedici panelinde, kaydı sonlandırmak için
Kaydı sonlandır düğmesini tıklayın.
Kullanıcı akışını tekrar oynatma
Bir kullanıcı akışını kaydettikten sonra 
Tekrar oynat düğmesini tıklayarak akışı tekrar oynatabilirsiniz.
Sayfada kullanıcı akışını tekrar oynatmayı görebilirsiniz. Tekrar oynatma ilerlemesi, Kaydedici panelinde de gösterilir.
Kayıt sırasında yanlış tıklama yaptıysanız veya bir şey çalışmıyorsa kullanıcı akışındaki hataları ayıklayabilirsiniz: Tekrar oynatmayı yavaşlatabilir, bir ayrılma noktası ayarlayabilir ve adım adım çalıştırabilirsiniz.
Yavaş ağ simülasyonunu göster
Tekrar oynatma ayarlarını yapılandırarak yavaş bir ağ bağlantısının simülasyonunu yapabilirsiniz. Örneğin, Tekrar oynatma ayarları'nı genişletin, Ağ açılır menüsünden Yavaş 3G'yi seçin.
Gelecekte daha fazla ayar desteklenebilir. İstediğiniz tekrar oynatma ayarlarını bizimle paylaşın.
Kullanıcı akışını ölçme
Performansı ölç düğmesini tıklayarak kullanıcı işlemleri akışının performansını ölçebilirsiniz. Örneğin ödeme, alışveriş yapan bir web sitesindeki kritik kullanıcı işlemleri akışıdır. Kaydedici paneli sayesinde ödeme akışını bir kez kaydedebilir ve düzenli olarak ölçebilirsiniz.
Performansı ölç düğmesi tıklandığında ilk olarak kullanıcı akışı tekrar oynatılır, ardından Performans panelinde performans izleme bölümü açılır.
Performans paneli ile sayfanızın çalışma zamanı performansını analiz etmeyi öğrenin. Performans panelinde Web Verileri onay kutusunu etkinleştirerek Web Verileri metriklerini görüntüleyebilir ve kullanıcılara göz atma deneyiminizi iyileştirme fırsatlarını belirleyebilirsiniz.
Adımları düzenle
Şimdi, kaydedilen iş akışındaki adımları düzenlemeye ilişkin temel seçeneklerin üzerinden geçelim.
Düzenleme seçeneklerinin kapsamlı bir listesi için özellik referansındaki Adımları düzenleme bölümüne bakın.
Adımları genişlet
İşlemin ayrıntılarını görmek için her adımı genişletin. Örneğin, Tıklama Öğesi "Cappuccino" adımını genişletin.
Yukarıdaki adımda iki seçici gösterilmektedir. Daha fazla bilgi için Kayıt seçiciyi anlama başlıklı makaleye bakın.
Kullanıcı akışını tekrar oynatırken Kaydedici, öğeyi seçicilerden biriyle sırayla sorgulamaya çalışır. Örneğin, Kaydedici ilk seçiciyi içeren öğeyi başarılı bir şekilde sorgularsa ikinci seçiciyi atlayıp sonraki adıma geçer.
Bir adımda seçici ekleme ve kaldırma
Seçicileri ekleyebilir veya kaldırabilirsiniz. Örneğin, bu durumda yalnızca aria/Cappuccino yeterli olacağı için 2 numaralı seçiciyi kaldırabilirsiniz. Fareyle 2. seçicinin üzerine gelin ve - simgesini tıklayarak kaldırın.
Bir adımdaki seçicileri düzenleme
Seçici de düzenlenebilir. Örneğin, Cappuccino yerine Mocha'yı seçmek isterseniz şunları yapabilirsiniz:
Bunun yerine seçici değerini aria/Mocha olarak düzenleyin.
Alternatif olarak Seç
düğmesini ve ardından sayfada Mocha'yı da tıklayabilirsiniz.Şimdi akışı tekrar oynatın. Cappuccino yerine Mocha'yı seçmeniz gerekir.
type, target, value gibi diğer adım özelliklerini düzenlemeyi deneyin.
Adım ekleme ve kaldırma
Adım ekleme ve kaldırma seçenekleri de vardır. Bu, fazladan bir adım eklemek veya yanlışlıkla eklenen bir adımı kaldırmak istediğinizde yararlı olur. Kullanıcı akışını yeniden kaydetmek yerine, akışı kolayca düzenleyebilirsiniz:
Düzenlemek istediğiniz adımı sağ tıklayın veya yanındaki üç nokta simgesini
tıklayın. 
Kaldırmak için Adımı kaldır'ı seçebilirsiniz. Örneğin, Mocha adımından sonraki Kaydırma etkinliği gerekli değildir.
Herhangi bir adım gerçekleştirmeden önce sayfada 9 kahvenin gösterilmesini beklemek istediğinizi varsayalım. Mocha adım menüsünde Önceki adımı ekle'yi seçin.
Assert Element'te, yeni adımı aşağıdaki ayrıntılarla düzenleyin:
- tür: waitForElement
- 1. seçici: .cup
- operatör: == (operatör ekle düğmesini tıklayın)
- sayı: 9 (sayı ekle düğmesini tıklayın)
Değişiklikleri görmek için şimdi akışı tekrar oynatın.
Sonraki adımlar
Tebrikler, eğitimi tamamladınız.
Kaydedici ile ilgili diğer özellikleri ve iş akışlarını (ör. içe ve dışa aktarma) keşfetmek için Kaydedici özellikleri referansı başlıklı makaleye bakın.