Substrate 抛硬币游戏(二):编写测试和UI

这篇文章主要介绍了Substrate 抛硬币游戏(二):编写测试和UI ,文中通过代码以及文档配合进行讲解,很详细,它对在座的每个人的研究和工作具有很经典的参考价值。 如果需要,让我们与区块链资料网一起学习。

https://www.interchains.cc/20903.html

Substrate 抛硬币游戏(二):编写测试和UI是很好的区块链资料,他说明了区块链当中的经典原理,可以给我们提供资料,Substrate 抛硬币游戏(二):编写测试和UI学习起来其实是很简单的,

不多的几个较为抽象的概念也很容易理解,之所以很多人感觉Substrate 抛硬币游戏(二):编写测试和UI比较复杂,一方面是因为大多数的文档没有做到由浅入深地讲解,概念上没有注意先后顺序,给读者的理解带来困难

Substrate 抛硬币游戏(二):编写测试和UI

  • Substrate
  • Polkadot

在之前的文章 Substrate应用 – 抛硬币游戏(一),我们完成了runtime的开发,从而实现了一个自定义功能(即抛硬币游戏)的区块链blockchain网络。现在让我们来看一下如何编写测试代码和UI,你也可以直接看最终的模块代码和UI代码。

在之前的文章 Substrate应用 – 抛硬币游戏(一),我们完成了runtime的开发,从而实现了一个自定义功能(即抛硬币游戏)的区块链blockchain网络。现在让我们来看一下如何编写测试代码和UI,你也可以直接看最终的模块代码和UI代码。

测试

重要性

为功能模块编写测试,是软件开发过程中不可缺省的一个环节,完备的测试能够:

  • 确保代码的执行符合预期;
  • 增强重构时的信心;
  • 从代码的使用角度,提升代码的设计等。

通常情况下,测试可以分为以下几种:

  • 单元测试,mock实现代码中的依赖如其它功能模块,仅测试当前函数的功能;
  • 集成测试,不mock实现代码中的依赖,对多个功能模块整体考虑,进行测试;
  • End to End 测试,是面向当前系统与依赖的第三方服务之间的测试。

当我们在使用Substrate进行开发时,主要会使用到单元测试和集成测试的方法,对于不同的场景,可以按需选择。一个最佳实践是,确保自定义的runtime模块有良好的测试覆盖

Rust 测试代码

Rust测试代码通常会和实现代码放在同一个文件或相同的目录下,取决于测试代码的数量,更多内容可以参Rust book。下面是一个简单的测试用例:

pub fn add_two(a: i32) -> i32 {     a + 2 }  #[cfg(test)] mod tests {     use super::*;      #[test]     fn test_add_two() {         assert_eq!(4, add_two(2));     } }

一些需要注意的点包括:

  • 测试代码使用属性#[cfg(test)]进行标识
  • use super::*用来引入当前模块的功能代码
  • 测试函数通过属性#[test]进行标识
  • 断言方式有:
  • 表达式的值为true:assert!(expression)
  • 表达式的值是期望的值:assert_eq!(expected, expression)
  • 表达式的值不是其它不相关的值:assert_ne!(other, expression)
  • 异常发生:#[should_panic]
  • Substrate提供了自定义的断言:
    • 结果为Ok(()):assert_ok!(expreesion)
    • 结果为Err(error_info):assert_err!(expression, error_info)
    • 结果为Err(error_info),并且不修改存储状态:assert_noop!(expression, error_info)

运行测试

// 运行当前目录下的src目录和tests目录下的所有测试 cargo test  // 运行当前工作空间的所有package下的测试 cargo test --all  // 运行runtime路径下的所有测试,由cargo.toml的`[dependencies.demo-node-runtime]`标识 cargo test -p demo-node-runtime  // 运行runtime路径下单个模块的测试 cargo test -p demo-node-runtime mymodule  // 获取更多帮助信息 cargo test --help

运行结果大致如下:

running 5 tests test mymodule::tests::it_works_for_default_value ... ok test mymodule::tests::play_should_work_for_lose ... ok test mymodule::tests::set_payment_should_work ... ok test mymodule::tests::play_should_work_for_win ... ok test mymodule::tests::play_security_check_should_work ... ok  test result: ok. 5 passed; 0 failed; 0 ignored; 0 measured; 1 filtered out

Runtime 测试

为了测试我们的runtime模块,需要首先引入相关的实现代码和依赖,

use super::*;  use runtime_io::with_externalities; use primitives::{H256, Blake2Hasher}; // --snip--

Runtime模块的功能被封装在一个结构体中,这里我们定义了一个mock的Test runtime结构体:

pub struct Test;

Test runtime需要实现被测模块以及所依赖的runtime模块的配置接口,回忆一下我们的模块接口定义,自定义的模块接口继承balances的接口,而 balances模块又继承了system的接口:

pub trait Trait: balances::Trait {     type Event: From<Event<Self>> + Into<<Self as system::Trait>::Event>; }

一些不关心的类型如Event可以用unit代替,这是因为Substrate为unit类型提供了多数接口的默认实现。这样,接口的实现分别是:

impl system::Trait for Test {     type Origin = Origin;     // --snip-- }  impl balances::Trait for Test {     type Balance = u64;     type OnFreeBalanceZero = ();     // --snip-- }  impl Trait for Test {     type Event = (); }

我们还可以对用到的模块定义别名,方便后面的使用:

type System = system::Module<Test>; type Balances = balances::Module<Test>; type mymodule = Module<Test>;

还记得runtime模块中callable function的第一个参数是Origin枚举类型吗?在实现代码中,construct_runtime!宏通过调用impl_outer_origin!自动为我们添加了Origin的定义。但是在测试代码中,我们需要自己调用impl_outer_origin!帮我们生成runtime所依赖的Origin类型,宏解析后的相关代码可以参考这里:

impl_outer_origin! {         pub enum Origin for Test {} }

初始化GenesisConfig

GenesisConfig存储了链上的原始状态,通常可以用来初始化:

  • 预置的账户
  • ROOT key
  • 账户的余额等。

这里首先初始化了system模块的GenesisConfig为所需的默认值,接着初始化balances模块,将Account ID为1的账户余额设置为10,Account ID为2的账户余额设置为20,其它的如交易费用等设置为0,方便我们计算测试结果。

fn new_test_ext() -> runtime_io::TestExternalities<Blake2Hasher> {     let (mut t, mut c) = system::GenesisConfig::<Test>::default().build_storage().unwrap();      let _ = balances::GenesisConfig::<Test>{         balances: vec![             (1, 10),             (2, 20),         ],         transaction_base_fee: 0,         transaction_byte_fee: 0,         existential_deposit: 0,         transfer_fee: 0,         creation_fee: 0,         vesting: vec![],     }.assimilate_storage(&mut t, &mut c).unwrap();      t.into() }

测试set_payment函数

我们通过属性#[test]标识了我们的测试函数为set_payment_should_work。当payment值为None时,设置payment为参数传入的值,当payment有值时,不做修改。

#[test] fn set_payment_should_work() {     with_externalities(&mut new_test_ext(), || {         // Set payment when payment is none         assert_ok!(mymodule::set_payment(Origin::signed(1), 100));         assert_eq!(mymodule::payment(), Some(100));         assert_eq!(mymodule::pot(), 100);          // Set payment when payment is not none         assert_ok!(mymodule::set_payment(Origin::signed(1), 200));         assert_eq!(mymodule::payment(), Some(100));         assert_eq!(mymodule::pot(), 100);     }); }

测试play函数

前置校验条件测试:

  • 函数调用应当是经过签名的

  • Payment中存储的值不应为空

  • 当用户的余额小于Payment中的值时,应返回错误

  • 当用户的余额多于Payment中的值是,应返回正常

    #[test] fn play_security_check_should_work() { with_externalities(&mut new_test_ext(), || {     // Test ensure_signed     assert_noop!(mymodule::play(Origin::ROOT), "bad origin: expected to be a signed origin");      // Test payment must be set     assert_noop!(mymodule::play(Origin::signed(2)), "Must have payment amount set");      // Check the balances in genesis config     assert_eq!(Balances::total_balance(&2), 20);      // set payment and pot, higher than the balances     <Payment<Test>>::put(30);     <Pot<Test>>::put(30);      assert_noop!(mymodule::play(Origin::signed(2)), "too few free funds in account");      // set payment and pot, lower than the balances     <Payment<Test>>::put(10);     <Pot<Test>>::put(10);     assert_ok!(mymodule::play(Origin::signed(2))); }) }

    获胜情景测试:

  • 首先初始化所需的存储状态

  • 设定随机种子

  • 断言用户获胜后的数据状态

    #[test] fn play_should_work_for_win() { with_externalities(&mut new_test_ext(), || {     <Payment<Test>>::put(10);     <Pot<Test>>::put(30);     <Nonce<Test>>::put(1);     System::set_random_seed(H256::from_low_u64_be(100));      assert_ok!(mymodule::play(Origin::signed(2)));     assert_eq!(mymodule::payment(), Some(10));     assert_eq!(mymodule::pot(), 10);     assert_eq!(Balances::total_balance(&2), 40); // 20 - 10 (payment) + 30 (reward)     assert_eq!(mymodule::nonce(), 2); }) }

    失败情景测试:

和获胜情景类似,不过我们选用了不同的随机种子,从而使用户失败:

#[test] fn play_should_work_for_lose() {     with_externalities(&mut new_test_ext(), || {         <Payment<Test>>::put(10);         <Pot<Test>>::put(30);         <Nonce<Test>>::put(1);         System::set_random_seed(H256::from_low_u64_be(10));          assert_ok!(mymodule::play(Origin::signed(2)));         assert_eq!(mymodule::payment(), Some(10));         assert_eq!(mymodule::pot(), 40);         assert_eq!(Balances::total_balance(&2), 10);         assert_eq!(mymodule::nonce(), 2);     }) }

完整的测试代码可参考这里.

UI开发

用户体验差是限制区块链blockchain技术应用的一个重要方面,实用漂亮的UI可以显著的提升用户满意度。这里我们为开发的抛硬币游戏编写一个简单的前端页面。

这里我们使用的是Parity官方的前端应用模板 substrate-front-end-template,基于

  • React,
  • Semantic UI
  • polkadot/api

初始化API和状态

根据项目的README文档可以快速启动这一模板应用,默认使用的是本地的节点WebSocket连接,即ws://127.0.0.1:9944,配置位于development.json。通过模板内置的useSubstrate功能函数来创建和Substrate节点交互的辅助组件,如api。

const { api } = useSubstrate();

新建一个自己的组件CoinFlipGame.js,初始化组件所需的state和设置对应state的函数,更多关于userState的解释参考 React官方文档。

// The transaction submission status const [status, setStatus] = useState(""); // The value stored in Payment const [currentPayment, setCurrentPayment] = useState(0); // The value stored in Pot const [potReward, setPotReward] = useState(0); // The value which will be set to Payment const [formPayment, setFormPayment] = useState(0);

状态更新

我们使用useEffect当api.query.mymodule的值发生变化时,重新设置currentPayment和potReward状态,当需要清理状态时调用相应的unsubscribe函数。

useEffect(() => {   let paymentUnsubscribe;   let potUnsubscribe;   api.query.mymodule.payment(newPayment => {     // The Payemnt storage value is an Option<Balance>     // So we have to check whether it is None first     // There is also unwrapOr     if (newPayment.isNone) {       setCurrentPayment('<None>');     } else {       setCurrentPayment(newPayment.unwrap().toNumber());       setStorePaymentDisabled(true);     }   }).then(unsub => {     paymentUnsubscribe = unsub;   }).catch(console.error);    api.query.mymodule.pot(reward => {     setPotReward(reward.toNumber());   }).then(unsub => {     potUnsubscribe = unsub;   }).catch(console.error);    return () => paymentUnsubscribe && potUnsubscribe &&     paymentUnsubscribe() && potUnsubscribe(); }, [api.query.mymodule]);

UI组件

显示Payment和Pot的数据组件,如下:

<Statistic   label="Current Payment"   value={currentPayment} />  <Statistic   label="Reward in Pot"   value={potReward} />

我们还可以通过输入框设置Payment的初始值,通过Set Payment按钮发送请求到模块的set_payment可调用函数,一旦Payment的值被设置之后,该button的状态就会变成disable。现在,我们可以通过Play按钮玩游戏了,它会发送请求到runtime模块的play函数。这里用到的 TxButton 也是模板内置的一个组件,用来帮我们发送query或transaction请求,监控请求的状态。

<Form>   <Form.Field>     <Input       type="number"       id="new_payment"       label="New Payment"       onChange={(_, { value }) => setFormPayment(value)}     />   </Form.Field>   <Form.Field>     <TxButton       accountPair={accountPair}       label={'Set Payment'}       disabled={storePaymentDisabled}       setStatus={setStatus}       type='TRANSACTION'       attrs={{         params: [formPayment],         tx: api.tx.mymodule.setPayment       }}     />     <TxButton       accountPair={accountPair}       label={'Play Game'}       setStatus={setStatus}       type='TRANSACTION'       attrs={{         params: [],         tx: api.tx.mymodule.play       }}     />   </Form.Field>   <div style={{ overflowWrap: 'break-word' }}>{status}</div> </Form

可调用函数play执行完成后,在Events结果中,可以看到我们定义的mymodule:PlayResult事件,及用户的地址和赢得的奖励,测试结果如下图所示。

Substrate 抛硬币游戏(二):编写测试和UI

总结

恭喜你,到这里你已经掌握了基于Substrate开发应用链的基本知识:

  • 实现runtime逻辑
  • 编写测试
  • 前端页面

如果你想学习更多前端开发的知识,请参考Substrate Front-End Tutorial,还可以通过不同的练习如substrate-collectables-workshop,甚至编写自己的业务runtime,来巩固这些知识并熟练应用。

Substrate开发者中心提供了很多学习资料,时常去逛一下,会有不同的收获。

部分转自网络,侵权联系删除www.interchains.cchttps://www.interchains.cc/20903.html

区块链毕设网(www.interchains.cc)全网最靠谱的原创区块链毕设代做网站 部分资料来自网络,侵权联系删除! 最全最大的区块链源码站 ! QQ3039046426
区块链知识分享网, 以太坊dapp资源网, 区块链教程, fabric教程下载, 区块链书籍下载, 区块链资料下载, 区块链视频教程下载, 区块链基础教程, 区块链入门教程, 区块链资源 » Substrate 抛硬币游戏(二):编写测试和UI

提供最优质的资源集合

立即查看 了解详情