The first example has two steps

[](https://)Feature: Guess the word # The first example has two steps Scenario: Maker starts a game When the Maker starts a game Then the Maker waits for a Breaker to join # The second example has three steps Scenario: Breaker joins a game Given the Maker has started a game with the word "silky" When the Breaker joins the Maker's game Then the Breaker must guess a word with 5 charactersMeeting Minute[](https://)Feature: Guess the word # The first example has two steps Scenario: Maker starts a game When the Maker starts a game Then the Maker waits for a Breaker to join # The second example has three steps Scenario: Breaker joins a game Given the Maker has started a game with the word "silky" When the Breaker joins the Maker's game Then the Breaker must guess a word with 5 charactersMeeting Minute > [time=Mon, Dec 14, 2020 6:54 PM] , Monaco, Consolas, "Courier New", monospace; font-size: 13.6px; letter-spacing: 0.35px; white-space: pre; backgro=== ###### tags: `Templates` `Meeting` :::info - **Location:** Room A - **Date:** Nov 1, 2030 2:30 PM (CET) - **Agenda** 1. Walk through signup flow `45min` > [name=Yukai] 2. Sprint planning `45min` 3. Revisit onboarding v1 `20min` - **Participants:** - Max (MX) - Yukai (YK) - Yuhsuan (YH) - Arwen (YC) - **Contact:** Max <max@example.com> - **Host:** YK - **Reference:** - [Last week meeting minute](/s/template-meeting-note) ::: ## Walk through signup flow - [Slide to explain the flow](/p/slide-example) :dart: Sprint Goal --- - Identify tasks that can help us raise conversion rate :books: Sprint Backlog --- - Email invite feature - Interview users :mag: Sprint Retro --- ### What we can start Doing - New initiatives and experiments we want to start improving :closed_book: Tasks -- ==Importance== (1 - 5) / Name / **Estimate** (1, 2, 3, 5, 8, 13) ### Development Team: - [x] ==5== Email invite - [x] ==4== Email registration page **5** - [x] ==5== Email invitees **3** - [x] ==4== Setup e2e test in production **2** ### Design Team: - [x] ==4== Interview users **8** - [x] ==5== Build roll-up display content **5** - [x] ==5== Help user discover new features **5** ## Notes  > [](https:# F1086353: UA-25-380526-00000-2620-1001077369.webm//)** > [] > [] Feature: Guess the word # The first example has two steps Scenario: Maker starts a game When the Maker starts a game Then the Maker waits for a Breaker to join # The second example has three steps Scenario: Breaker joins a game Given the Maker has started a game with the word "silky" When the Breaker joins the Maker's game Then the Breaker must guess a word with 5 characters(https:# F1086353: UA-25-380526-00000-2620-1001077369.webm//)**Feature: Guess the word # The first example has two steps Scenario: Maker starts a game When the Maker starts a game Then the Maker waits for a Breaker to join # The second example has three steps Scenario: Breaker joins a game Given the Maker has started a game with the word "silky" When the Breaker joins the Maker's game Then the Breaker must guess a word with 5 characters[Feature: Guess the word # The first example has two steps Scenario: Maker starts a game When the Maker starts a game Then the Maker waits for a Breaker to join # The second example has three steps Scenario: Breaker joins a game Given the Maker has started a game with the word "silky" When the Breaker joins the Maker's game Then the Breaker must guess a word with 5 characters`--- title: Talk slides template tags: Templates, Talk description: View the slide with "Slide Mode". --- # Unleash the power!  slide: https://hackmd.io/p/template-Talk-slide --- We have a collaborative session please prepare laptop or smartphone to join! --- ## Who am I? - Front-end developer - VSCode :heart: - I use tabs. :cat: --- ### 70% of our users are developers. Developers :heart: GitHub. --- {%youtube E8Nj7RwXf0s %} --- ### Usage flow --- ```graphviz digraph { compound=true rankdir=RL graph [ fontname="Source Sans Pro", fontsize=20 ]; node [ fontname="Source Sans Pro", fontsize=18]; edge [ fontname="Source Sans Pro", fontsize=12 ]; subgraph core { c [label="Hackmd-it \ncore"] [shape=box] } c -> sync [ltail=session lhead=session] subgraph cluster1 { concentrate=true a [label="Text source\nGithub, Gitlab, ..."] [shape=box] b [label="HackMD Editor"] [shape=box] sync [label="sync" shape=plaintext ] b -> sync [dir="both"] sync -> a [dir="both"] label="An edit session" } } ``` --- ### Architecture of extension --- ![](https://i.imgur.com/ij69tPh.png) --- ## Content script - Bind with each page - Manipulate DOM - Add event listeners - Isolated JavaScript environment - It doesn't break things --- # :fork_and_knife: --- <style> code.blue { color: #337AB7 !important; } code.orange { color: #F7A004 !important; } </style> - <code class="orange">onMessage('event')</code>: Register event listener - <code class="blue">sendMessage('event')</code>: Trigger event --- # :bulb: --- - Dead simple API - Only cares about application logic --- ```typescript import * as Channeru from 'channeru' // setup channel in different page environment, once const channel = Channeru.create() ``` --- ```typescript // in background script const fakeLogin = async () => true channel.answer('isLogin', async () => { return await fakeLogin() }) ``` ```typescript // in inject script const isLogin = await channel.callBackground('isLogin') console.log(isLogin) //-> true ``` --- # :100: :muscle: :tada: --- ### Wrap up - Cross envornment commnication - A small library to solve messaging pain - TypeScript Rocks :tada: --- ### Thank you! :sheep: You can find me on - GitHub - Twitter - or email me # F1086353: UA-25-380526-00000-2620-1001077369.webm F1056901: recording-1603978613046.webm[# F1086353: UA-25-380526-00000-2620-1001077369.webm](https://)# F1086353: UA-25-380526-00000-2620-1001077369.webm | Column 1 | Column 2 | | Column 3 | | -------------------------------------------------------- | -------- | --- | ---------------------------------------------------------- | | Text # F1086353: UA-25-380526-00000-2620-1001077369.webm | Text | # F1086353: UA-25-380526-00000-2620-1001077369.webm | Text # F1086353: UA-25-380526-00000-2620-1001077369.webm | `](https://)UA 25 380526 00000 2620 1001077369