jahvi

<template>
  <div
    class="product relative align-center w-100 pb20"
    v-observe-visibility="visibilityChanged"
  >
    <wishlist-button class="wishlist-button" :product="product" />
    <!-- ... -->
  </div>
</template>

jahvi

<template>
  <button type="button" class="root" :class="{ active: isOnWishlist }" @click="isOnWishlist ? removeFromWishlist(product) : addToWishlist(product)" data-testid="addToWishlist">
    <svg width="18" height="16" viewBox="0 0 18 16">
      <path
        d="M9.01163699,14.9053769 C8.72930024,14.7740736 8.41492611,14.6176996 8.07646224,14.4366167 C7.06926649,13.897753 6.06198912,13.2561336 5.12636931,12.5170512 C2.52930452,10.4655288 1.00308384,8.09476443 1.00000218,5.44184117 C0.997549066,2.99198843 2.92175104,1.01242822 5.28303025,1.01000225 C6.41066623,1.00972036 7.49184369,1.4629765 8.28270844,2.2678673 L8.99827421,2.9961237 L9.71152148,2.26559643 C10.4995294,1.45849728 11.5791258,1.0023831 12.7071151,1.00000055 L12.7060299,1.00000225 C15.0693815,0.997574983 16.9967334,2.97018759 17.0000037,5.421337 C17.0038592,8.07662382 15.4809572,10.4530151 12.8850542,12.5121483 C11.9520963,13.2521931 10.9477036,13.8951276 9.94340074,14.4354976 C9.60619585,14.6169323 9.29297309,14.7736855 9.01163699,14.9053769 Z"

jahvi

const { createUpwardServer } = require('@magento/upward-js');

async function serve() {
  await createUpwardServer({
    port: 8000,
    bindLocal: true,
    logUrl: true,
    upwardPath: './upward-hello.yml'
  });
}

jahvi

status: 200
headers:
  inline:
    content-type:
      inline: text/html
body:
  inline: 'Hello World'

jahvi

status: response.status # [Go to 1]
headers: response.headers # [Go to 1]
body: response.body # [Go to 1]

# 1
response:
  when:
    - matches: request.url.pathname
      pattern: '^/pokemon/graphql'
      use: pokemonGQL # [Go to 2]

jahvi

status: response.status # [Go to 1]
headers: response.headers # [Go to 1]
body: response.body # [Go to 1]

# 1
response:
  when:
    - matches: request.url.pathname
      pattern: '^/pokemon/graphql'
      use: pokemonGQL # [Go to 2]

jahvi

<img src="{{pokemonData.image}}" /><br/>
<strong>Name:</strong> {{pokemonData.name}}<br/>
<strong>Type:</strong>
{{#pokemonData.types}}
    {{.}}
{{/pokemonData.types}}
<br/>
<strong>Height:</strong>
{{pokemonData.height.minimum}} - {{pokemonData.height.maximum}}<br/>
<strong>Weight:</strong>

jahvi

status: response.status # [Go to 1]
headers: response.headers # [Go to 1]
body: response.body # [Go to 1]

# 1
response:
  when:
    - matches: request.url.pathname
      pattern: '^/pokemon/graphql'
      use: pokemonGQL # [Go to 2]

jahvi

query($pokemonName: String) {
    pokemon(name: $pokemonName) {
        name
        image
        types
        weight {
            minimum
            maximum
        }
        height {

jahvi

const express = require('express');
const { middleware } = require('@magento/upward-js');

async function serve() {
  const app = express();
  const port = 8000;

  app.get('/', (req, res) => res.send('Hello from Express!'));

  const upwardMiddleware = await middleware(`${__dirname}/upward.yml`);