WeAreGenki/minna-ui

View on GitHub
utils/preprocess/src/__tests__/__snapshots__/style.test.ts.snap

Summary

Maintainability
Test Coverage
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Svelte style preprocessor compiles a component's CSS 1`] = `
"@media screen and (min-width: 30em){body{margin:0
  }}.text.svelte-1ghwuak.svelte-1ghwuak{color:rgb(255, 0, 0)}.text.svelte-1ghwuak.svelte-1ghwuak:focus{background:rgb(0, 0, 0)}.wrapper.svelte-1ghwuak>.text.svelte-1ghwuak{margin-top:1rem}"
`;

exports[`Svelte style preprocessor does not process without type attribute 1`] = `
"
<div id=\\"target\\">test</div>

<style>
  #target {
    color: red;

    &:focus {
      background: #000;
    }
  }
</style>
"
`;

exports[`Svelte style preprocessor processes a component 1`] = `
"<!--
  TEST COMPONENT

  A simple Svelte component for use in tests.

  NOTE:
    In the code, object properties starting with _ are safe to mangle; the name
    can be shortened at build time for smaller JavaScript bundles.
-->

<script>
  export let name = 'Elon Musk';

  $: reversed = name.split('').reverse().join('');
</script>

<style type=\\"text/postcss\\">
  @media screen and (min-width: 30em) {
  :global(body) {
      margin: 0
  }
    }

  .text {
    color: rgb(255, 0, 0);
  }

  /* red */

  .text:focus {
      background: rgb(0, 0, 0); /* black */
    }

  .wrapper > .text {
      margin-top: 1rem;
    }
</style>

<svelte:options immutable=\\"{true}\\" />

<div class=\\"wrapper\\">
  <div id=\\"name\\" class=\\"text\\" tabindex=\\"-1\\">
    Name: {name}
  </div>

  <div id=\\"nameReversed\\" class=\\"text\\">
    Name: <span>{reversed}</span>
  </div>
</div>
"
`;

exports[`Svelte style preprocessor processes a simple component 1`] = `
"
<div id=\\"target\\">test</div>

<style type=\\"text/postcss\\">
  #target {
    color: red;
  }

    #target:focus {
      background: #000;
    }
</style>
"
`;