rofrischmann/elodin

View on GitHub
generators/reason-css/src/__tests__/__snapshots__/createGenerator-test.js.snap

Summary

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

exports[`Generating files using @elodin/generator-reason should add reset class names 1`] = `
Object {
  "StyleButton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": "._1hjhowh {
  color: red
}",
  "StyleStyle.re": "[%bs.raw {| require(\\"./StyleButton.elo.css\\") |}];
[%bs.raw {| require(\\"./StyleButtonText.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"elo _diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  \\"elo _1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should generate css files for each style and a single reason file 1`] = `
Object {
  "StyleButton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": "._1hjhowh {
  color: red
}",
  "StyleStyle.re": "[%bs.raw {| require(\\"./StyleButton.elo.css\\") |}];
[%bs.raw {| require(\\"./StyleButtonText.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  \\"_1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should generate readable classnames in devMode 1`] = `
Object {
  "StyleButton.elo.css": ".Button_diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  .Button_diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

.Button_diyf7s__Mode-Dark {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": ".ButtonText_1hjhowh {
  color: red
}",
  "StyleStyle.re": "[%bs.raw {| require(\\"./StyleButton.elo.css\\") |}];
[%bs.raw {| require(\\"./StyleButtonText.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" Button_diyf7s__Mode-Dark\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"Button_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  \\"ButtonText_1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should only generate a reason file 1`] = `
Object {
  "StyleButton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": "._1hjhowh {
  color: red
}",
  "StyleStyle.re": "[%bs.raw {| require(\\"./StyleButton.elo.css\\") |}];
[%bs.raw {| require(\\"./StyleButtonText.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  \\"_1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should only generate a reason file with baseClassName 1`] = `
Object {
  "StyleButton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": "._1hjhowh {
  color: red
}",
  "StyleStyle.re": "[%bs.raw {| require(\\"./StyleButton.elo.css\\") |}];
[%bs.raw {| require(\\"./StyleButtonText.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"elo _diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  \\"elo _1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should use a custom style name 1`] = `
Object {
  "StyleButton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": "._1hjhowh {
  color: red
}",
  "StyleStyle.re": "[%bs.raw {| require(\\"./StyleButton.elo.css\\") |}];
[%bs.raw {| require(\\"./StyleButtonText.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let buttonStyle = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonTextStyle = () => {
  \\"_1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should use custom css file names 1`] = `
Object {
  "STYLEbutton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "STYLEbuttontext.elo.css": "._1hjhowh {
  color: red
}",
  "StyleStyle.re": "[%bs.raw {| require(\\"./STYLEbutton.elo.css\\") |}];
[%bs.raw {| require(\\"./STYLEbuttontext.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  \\"_1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should use custom reason file names 1`] = `
Object {
  "ElodinStyle.re": "[%bs.raw {| require(\\"./StyleButton.elo.css\\") |}];
[%bs.raw {| require(\\"./StyleButtonText.elo.css\\") |}];

[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  \\"_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  \\"_1hjhowh\\"
}",
  "StyleButton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": "._1hjhowh {
  color: red
}",
}
`;

exports[`Generating files using @elodin/generator-reason should use dynamic imports 1`] = `
Object {
  "StyleButton.elo.css": "._diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  ._diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

._diyf7s_0-0 {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "StyleButtonText.elo.css": "._1hjhowh {
  color: red
}",
  "StyleStyle.re": "[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" _diyf7s_0-0\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  [%bs.raw {| import(\\"./StyleButton.elo.css\\") |}];

  \\"_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  [%bs.raw {| import(\\"./StyleButtonText.elo.css\\") |}];

  \\"_1hjhowh\\"
}",
}
`;

exports[`Generating files using @elodin/generator-reason should work with all options combined 1`] = `
Object {
  "ElodinStyle.re": "[@bs.deriving jsConverter]
type mode =
  | Dark
  | Light;

let getButtonVariants = (~mode, ()) => {
  switch (mode) {
    | (Some(Dark)) => \\" Button_diyf7s__Mode-Dark\\"
    | (Some(Light)) => \\"\\"
    | (None) => \\"\\"
  }
};

let button = (~right=?, ~bottom=?, ~mode=?, ()) => {
  [%bs.raw {| import(\\"./STYLEbutton.elo.css\\") |}];

  \\"elo Button_diyf7s\\" ++ \\" \\" ++ getButtonVariants(~mode, ())
}

let buttonText = () => {
  [%bs.raw {| import(\\"./STYLEbuttontext.elo.css\\") |}];

  \\"elo ButtonText_1hjhowh\\"
}",
  "STYLEbutton.elo.css": ".Button_diyf7s {
  padding-left: 10px;
  padding-right: var(--right)
}

@media (min-width: 1024px) {
  .Button_diyf7s {
    padding-left: 20px;
    padding-right: var(--right)
  }
}

.Button_diyf7s__Mode-Dark {
  padding-top: 10px;
  padding-bottom: var(--bottom)
}",
  "STYLEbuttontext.elo.css": ".ButtonText_1hjhowh {
  color: red
}",
}
`;