Program Test Etme

Cosmos ağı üzerinde Merkeziyetsiz Uygulamalar (DApp'ler) geliştirmek, genellikle Keplr cüzdanı ile entegre olmayı içerir. Test etme, kullanıcıların DApp'inizle Keplr cüzdanı aracılığıyla sorunsuz bir şekilde etkileşimde bulunmasını sağlamak için kritik öneme sahiptir.

, Keplr tabanlı DApp'ler için test sürecini basitleştiren uçtan uca (e2e) bir test çerçevesidir. Bu çerçeve, DApp'inizin Keplr cüzdanıyla etkileşimlerini test etmeyi otomatikleştirir ve gerçek kullanıcı deneyimlerini simüle eder. @agoric/synpress, Metamask tabanlı DApp'ler için tasarlanmış olan çerçevesi üzerine inşa edilmiştir.

@agoric/synpress, üzerine inşa edildiğinden, resmi , @agoric/synpress ile kullanabileceğiniz birçok bilgi içermektedir.

Kurulum

DApp'inizi Keplr ile test etmeye başlamadan önce, projenizde @agoric/synpress'i aşağıdaki komutla yüklemeniz gerekir:

yarn add -D @agoric/synpress

Proje Yapısı

E2E testlerinizi düzenli ve yönetilebilir tutmak için aşağıdaki proje yapısını öneriyoruz:

project_dir
└── src
└── tests
    └── e2e
        └── synpress.config.js
        └── support.js
        └── specs
            └── test.spec.js

`synpress.config.js` Dosyasını Yapılandırma

E2E testlerinizi yazmaya başlamadan önce, projenizin tests/e2e dizininde synpress.config.js adlı bir yapılandırma dosyası oluşturmanız gerekir.

synpress.config.js içinde, e2e yapılandırması içerisinde baseUrl özelliğini ayarlayacaksınız. Bu, Cypress'e DApp'inizi test sırasında nerede bulacağını söyler. İşte bir örnek yapılandırma:

const baseConfig = require('@agoric/synpress/synpress.config');
const { defineConfig } = require('cypress');

module.exports = defineConfig({
  ...baseConfig,
  e2e: {
    ...baseConfig.e2e,
    baseUrl: 'http://localhost:5173'
  }
});

Bu örnekte, baseUrl, http://localhost:5173 olarak ayarlanmıştır. Bunu, DApp'inizin çalıştığı gerçek URL ile değiştirmeniz gerektiğini unutmayın.

Varsayılan olarak, synpress.config.js dosyasını oluşturmazsanız, @agoric/synpress, DApp'inizin yerel makinenizin 3000 numaralı portunda çalıştığını varsayar (http://localhost:3000). Doğru baseUrl belirlemek, testlerinizin DApp'inizin doğru örneğiyle etkileşime girmesini sağlar.

tests/e2e klasöründe ayrı bir synpress.config.js'e sahip olduğunuzdan, testlerinizi çalıştırırken yerini belirtmeniz gerekir. Bunu yapmak için synpress run komutuyla --configFile bayrağını kullanın:

EXTENSION=keplr synpress run --configFile=tests/e2e/synpress.config.js

Destek Dosyası Oluşturma

Projenizin tests/e2e dizinine gidin ve support.js adında yeni bir dosya oluşturun. Bu dosya, yaygın test etme eylemlerini kapsayan yeniden kullanılabilir komutlar oluşturmak için kullanılabilir. Örneğin, uygulamanızdaki belirli bir sayfaya gitmek için özel bir komut oluşturabilirsiniz. Bununla ilgili daha fazla bilgi bulunabilir.

support.js dosyanızı oluşturduktan sonra, aşağıdaki içe aktarma ifadesini eklemeyi unutmayın:

import '@agoric/synpress/support/index';

Bu içe aktarma, DApp'inizin e2e testleri sırasında Keplr cüzdanıyla etkileşimde bulunmak için gerekli işlevleri içe aktarır. Bunu yapmazsanız, testleriniz, Keplr entegrasyonu için @agoric/synpress tarafından sağlanan özellikleri kullanamaz.

Örnek Testler

Ortam hazır olduğunda, DApp'inizin işlevselliğini test etmek için uçtan uca (e2e) testler yazalım. tests/e2e/specs klasöründe, test ettiğiniz şeyi yansıtan açıklayıcı bir isimle yeni bir dosya oluşturun (örneğin, user_login.spec.js veya token_transfer.spec.js).

Test Yapısı

İlgili testleri gruplamak için describe bloklarını, bu grupların içinde bireysel test durumlarını tanımlamak için it bloklarını kullanırsınız.

describe('Kullanıcı Girişi', () => {
  it('geçerli kimlik bilgileri ile giriş yapmalıdır', () => {
    // Giriş işlevselliği için test adımları
  });
});

Test 1: Keplr Cüzdanını Kurma

it('Keplr cüzdanını kurmalıdır', () => {
  cy.setupWallet({
    secretWords: 'KEPLR_MNEMONIC'
  });
  cy.visit('/');
});

Bu test durumu, cy.setupWallet yöntemini kullanarak testleriniz için bir Keplr cüzdanı kurmayı simüle eder. KEPLR_MNEMONIC'i 24 kelimeden oluşan bir mnemonic ifade ile değiştirmeniz önemlidir. setupWallet yöntemi, sağlanan mnemonic ifadeye dayanan bir cüzdan oluşturur ve bu cüzdan, test setiniz boyunca kullanılabilir.

Cüzdanı kurduktan sonra, cy.visit('/') ile DApp'in kök yoluna (/) gidiyoruz.

Test 2: Keplr Cüzdanını Bağlama

it('cüzdan ile bağlantıyı kabul etmelidir', () => {
  cy.contains('Cüzdanı Bağla').click();
  cy.acceptAccess();
});

Bu test, kullanıcının Keplr cüzdanını DApp'inize bağlamasını simüle eder. cy.contains('Cüzdanı Bağla'), web sayfasında Cüzdanı Bağla metnini içeren bir öğeyi arar ve bir tıklama olayı tetikler. cy.acceptAccess, DApp'iniz için Keplr cüzdan erişimini kabul etmeyi simüle eder.

Test 3: Bir İşlemi İmzalama

it('teklif verme işlemini onaylamalıdır', () => {
  cy.contains('Teklif Ver').click();
  cy.confirmTransaction();
});

Bu test, DApp'inizde işlem imzalamayı simüle eder. cy.contains('Teklif Ver'), Teklif Ver metnini içeren bir öğeyi arar ve bir tıklama olayı tetikler. cy.confirmTransaction, bir işlemi onaylamayı simüle eder.

Testleri Çalıştırma

Artık testleri çalıştırmak için bu komutu kullanabilirsiniz:

EXTENSION=keplr synpress run --configFile=tests/e2e/synpress.config.js

`@agoric/synpress` Kullanan Projeler

E2E testler için @agoric/synpress kullanan bazı örnek projeler:

`@agoric/synpress` Komutları

@agoric/synpress komutları, Keplr ile kullanılmak üzere tasarlanan özel Cypress komutlarıdır. Keplr'ye özgü öğelerle ve iş akışlarıyla etkileşimde bulunmak için hazır fonksiyonlar sağlar.

`setupWallet`

Test etmek için bir Keplr cüzdanını başlatır. Sağlanan seçeneklerle ya yeni bir cüzdan oluşturabilir ya da mevcut bir cüzdanı içe aktarabilirsiniz.

Argümanlar:

(Tüm argümanlar isteğe bağlıdır)

Komut, aşağıdaki anahtarlarla birlikte bir nesne argümanı alır:

secretWords (string): Cüzdan için gizli kelimeler. (varsayılan, Agoric zincirinde bir cüzdan adresini temsil eden önceden tanımlanmış bir mnemonic ifadedir)
privateKey (string): Cüzdan için özel anahtar.
password (string): Cüzdanın parolası. (varsayılan Test1234).
walletName (string): Cüzdanın adı. (varsayılan My Wallet).
selectedChains (array): Seçilecek zincirler. (varsayılan boş bir dizi, []).
createNewWallet (boolean): Yeni bir cüzdan oluşturulup oluşturulmayacağını belirler (varsayılan false).

Döner:

(boolean): Cüzdan başarıyla kurulduysa true, aksi takdirde false.

`acceptAccess`

Keplr cüzdanının bir DApp'e bağlanması için yetkilendirme sürecini yönetir. DApp'ler, bu süreci başlatmak için Cüzdanı Bağla seçeneği sunar.

Döner:

(boolean): Erişim başarıyla kabul edildiyse true, aksi takdirde false.

`confirmTransaction`

Keplr cüzdanı ile DApp içinde işlemleri imzalamayı yönetir. Bu, bir kullanıcı, token gönderme veya bir akıllı sözleşme ile etkileşim gibi bir işlem başlattığında gerçekleşir.

Döner:

(boolean): İşlem başarıyla onaylandıysa true, aksi takdirde false.

`disconnectWalletFromDapp`

Keplr cüzdanını daha önce bağlandığı tüm DApp'lerden ayırır.

Döner:

(boolean): Ayrılma işlemi başarılıysa true, aksi takdirde false.

`getWalletAddress`

Belirtilen blockchain ile ilişkilendirilmiş mevcut cüzdan adresini alır.

Argümanlar:

chainName (string): Cüzdan adresini almak istediğiniz blockchain'in adı.

Döner:

(string): Belirtilen blockchain için cüzdan adresi.

`switchWallet`

Aktif cüzdanı belirtilen isimle değiştirir.

Argümanlar:

walletName (string): Geçiş yapmak istediğiniz cüzdanın adı. Bu, setupWallet komutuyla oluşturulduğunda kullanılan ad ile eşleşmelidir.

Döner:

(boolean): Cüzdan geçişi başarılıysa true, aksi takdirde false.

`addNewTokensFound`

Bağlandığı yeni blockchain ağında Keplr uzantısı tarafından keşfedilen tüm yeni tokenleri kullanıcının token portföyüne ekler.

Döner:

(boolean): Tokenler başarıyla kullanıcının token portföyüne eklendiyse true, aksi takdirde false.

`getTokenAmount`

Cüzdandaki belirtilen tokenin bakiyesini alır.

Argümanlar:

tokenName (string): Bakiyesini almak istediğiniz tokenin adı.

Döner:

(number): Cüzdanda şu anda tutulan belirtilen token miktarı.

`isExtensionWindowActive`

Keplr uzantısının penceresinin şu anda aktif sekme olup olmadığını belirler.

Döner:

(boolean): Keplr uzantı penceresi aktifse true, aksi takdirde false.

`switchToExtensionWindow`

Odaklanmayı Keplr uzantısı penceresi sekmesine değiştirir. Keplr penceresi, cüzdanla ilgili işlemleri yönetmek için kullanılır.

Döner:

(boolean): Odak değişikliği başarılıysa true, aksi takdirde false.

`isCypressWindowActive`

DApp'in çalıştığı Cypress penceresinin şu anda aktif sekme olup olmadığını belirler.

Döner:

(boolean): Cypress penceresi aktifse true, aksi takdirde false.

`switchToCypressWindow`

Odaklanmayı Cypress penceresi sekmesine değiştirir.

Döner:

(boolean): Odak değişikliği başarılıysa true, aksi takdirde false.

Tüm komutların tam listesini görmek için bakabilirsiniz.

Program Test Etme

Kurulum​

Proje Yapısı​

synpress.config.js Dosyasını Yapılandırma​

Destek Dosyası Oluşturma​

Örnek Testler​

Test Yapısı​

Test 1: Keplr Cüzdanını Kurma​

Test 2: Keplr Cüzdanını Bağlama​

Test 3: Bir İşlemi İmzalama​

Testleri Çalıştırma​

@agoric/synpress Kullanan Projeler​

@agoric/synpress Komutları​

setupWallet​

acceptAccess​

confirmTransaction​

disconnectWalletFromDapp​

getWalletAddress​

switchWallet​

addNewTokensFound​

getTokenAmount​

isExtensionWindowActive​

switchToExtensionWindow​

isCypressWindowActive​

switchToCypressWindow​

Kurulum

Proje Yapısı

`synpress.config.js` Dosyasını Yapılandırma

Destek Dosyası Oluşturma

Örnek Testler

Test Yapısı

Test 1: Keplr Cüzdanını Kurma

Test 2: Keplr Cüzdanını Bağlama

Test 3: Bir İşlemi İmzalama

Testleri Çalıştırma

`@agoric/synpress` Kullanan Projeler

`@agoric/synpress` Komutları

`setupWallet`

`acceptAccess`

`confirmTransaction`

`disconnectWalletFromDapp`

`getWalletAddress`

`switchWallet`

`addNewTokensFound`

`getTokenAmount`

`isExtensionWindowActive`

`switchToExtensionWindow`

`isCypressWindowActive`

`switchToCypressWindow`