Skip to content

Commit

Permalink
[autofix.ci] apply automated fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
autofix-ci[bot] authored Dec 6, 2024
1 parent 63cd1e1 commit 8b1b50d
Show file tree
Hide file tree
Showing 3 changed files with 83 additions and 49 deletions.
89 changes: 57 additions & 32 deletions packages/next-yak/runtime/__tests__/attrs.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -91,9 +91,11 @@ it("should not call a function passed to attrs as an object value", () => {
});

it("defaultProps are merged into what function attrs receives", () => {
const Comp = (styled("button") as typeof styled.button).attrs<DataAttributes>((props) => ({
"data-color": props.color,
}))``;
const Comp = (styled("button") as typeof styled.button).attrs<DataAttributes>(
(props) => ({
"data-color": props.color,
}),
)``;

Comp.defaultProps = {
color: "red",
Expand All @@ -110,7 +112,9 @@ it("defaultProps are merged into what function attrs receives", () => {
});

it("pass props to the attr function", () => {
const Comp = (styled("button") as typeof styled.button).attrs<{ $submit?: boolean }>((p) => ({
const Comp = (styled("button") as typeof styled.button).attrs<{
$submit?: boolean;
}>((p) => ({
type: p.$submit ? "submit" : "button",
}))``;

Expand All @@ -131,7 +135,9 @@ it("pass props to the attr function", () => {
});

it("should replace props with attrs", () => {
const Comp = (styled("button") as typeof styled.button).attrs<{ $submit?: boolean }>((p) => ({
const Comp = (styled("button") as typeof styled.button).attrs<{
$submit?: boolean;
}>((p) => ({
type: p.$submit ? "submit" : "button",
tabIndex: 0,
}))``;
Expand Down Expand Up @@ -175,7 +181,9 @@ it("should merge className", () => {
});

it("should merge className from folded attrs", () => {
const Inner = (styled("div") as typeof styled.div).attrs({ className: "foo" })``;
const Inner = (styled("div") as typeof styled.div).attrs({
className: "foo",
})``;

const Comp = styled(Inner).attrs(() => ({
className: "meow nya",
Expand All @@ -191,9 +199,11 @@ it("should merge className from folded attrs", () => {
});

it("should merge className even if its a function", () => {
const Comp = (styled("div") as typeof styled.div).attrs<{ $purr?: boolean }>((p) => ({
className: `meow ${p.$purr ? "purr" : "nya"}`,
}))``;
const Comp = (styled("div") as typeof styled.div).attrs<{ $purr?: boolean }>(
(p) => ({
className: `meow ${p.$purr ? "purr" : "nya"}`,
}),
)``;

expect(TestRenderer.create(<Comp />).toJSON()).toMatchInlineSnapshot(`
<div
Expand Down Expand Up @@ -232,10 +242,12 @@ it("should merge style", () => {
});

it("should work with data and aria attributes", () => {
const Comp = (styled("div") as typeof styled.div).attrs<DataAttributes>(() => ({
"data-foo": "bar",
"aria-label": "A simple FooBar",
}))``;
const Comp = (styled("div") as typeof styled.div).attrs<DataAttributes>(
() => ({
"data-foo": "bar",
"aria-label": "A simple FooBar",
}),
)``;
expect(TestRenderer.create(<Comp />).toJSON()).toMatchInlineSnapshot(`
<div
aria-label="A simple FooBar"
Expand Down Expand Up @@ -347,7 +359,9 @@ it("should override children", () => {
});

it('should shallow merge "style" prop + attr instead of overwriting', () => {
const Paragraph = (styled("p") as typeof styled.p).attrs<{ $fontScale?: number }>((p) => ({
const Paragraph = (styled("p") as typeof styled.p).attrs<{
$fontScale?: number;
}>((p) => ({
style: {
...p.style,
fontSize: `${p.$fontScale}em`,
Expand Down Expand Up @@ -407,7 +421,9 @@ it("does not pass transient props to HTML element", () => {
});

it.skip('should apply given "as" prop to the progressive type', () => {
const Comp = (styled("div") as typeof styled.div).attrs<{ as?: any }>({ as: "video" as const })``;
const Comp = (styled("div") as typeof styled.div).attrs<{ as?: any }>({
as: "video" as const,
})``;

//@ts-expect-error
expect(TestRenderer.create(<Comp loop />).toJSON()).toMatchInlineSnapshot(`
Expand All @@ -421,12 +437,13 @@ it.skip('should apply given "as" prop to the progressive type', () => {

// our own tests
it("should remap props", () => {
const Comp = (styled("button") as typeof styled.button).attrs<{ primary?: boolean; $submit?: boolean }>(
(p) => ({
type: p.$submit ? "submit" : "button",
$primary: p.primary,
}),
)<{ $primary?: boolean }>``;
const Comp = (styled("button") as typeof styled.button).attrs<{
primary?: boolean;
$submit?: boolean;
}>((p) => ({
type: p.$submit ? "submit" : "button",
$primary: p.primary,
}))<{ $primary?: boolean }>``;

expect(TestRenderer.create(<Comp />).toJSON()).toMatchInlineSnapshot(`
<button
Expand All @@ -451,9 +468,11 @@ it("should remap props", () => {
});

it("should have optional attrs props as component interface", () => {
const Comp = (styled("h1") as typeof styled.h1).attrs<{ $primary?: boolean }>({
$primary: true,
})``;
const Comp = (styled("h1") as typeof styled.h1).attrs<{ $primary?: boolean }>(
{
$primary: true,
},
)``;

expect(TestRenderer.create(<Comp />).toJSON()).toMatchInlineSnapshot(`
<h1
Expand Down Expand Up @@ -516,7 +535,9 @@ it("should pass theme if theme is overwritten", () => {

describe("attrs bug next-yak/issues/163", () => {
it("should allow to delete a prop", () => {
const Comp = (styled("h1") as typeof styled.h1).attrs<{ primary?: boolean }>({
const Comp = (styled("h1") as typeof styled.h1).attrs<{
primary?: boolean;
}>({
primary: undefined,
})``;

Expand All @@ -529,7 +550,9 @@ describe("attrs bug next-yak/issues/163", () => {
});

it("should allow to rename a prop", () => {
const Comp = (styled("h1") as typeof styled.h1).attrs<{ primary?: boolean }>((p) => ({
const Comp = (styled("h1") as typeof styled.h1).attrs<{
primary?: boolean;
}>((p) => ({
...p,
primary: undefined,
$primary: p.primary,
Expand All @@ -544,12 +567,14 @@ describe("attrs bug next-yak/issues/163", () => {
});

it("should allow to rename a prop in overwritten attrs", () => {
const Parent = (styled("h1") as typeof styled.h1).attrs<{ count: number }>((p) => {
expect(p.count).toBe(1);
return {
count: ++p.count,
};
})``;
const Parent = (styled("h1") as typeof styled.h1).attrs<{ count: number }>(
(p) => {
expect(p.count).toBe(1);
return {
count: ++p.count,
};
},
)``;
const Comp = styled(Parent).attrs<{ count: number }>((p) => {
expect(p.count).toBe(2);
return {
Expand Down
28 changes: 20 additions & 8 deletions packages/next-yak/runtime/__tests__/styled.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -95,9 +95,11 @@ it("should filter out properties starting with $ when passing to custom", () =>
});

it("should forward properties to the next yak component", () => {
const Component = (styled("input") as typeof styled.input).attrs(({ $text }) => ({
"aria-label": $text,
}))``;
const Component = (styled("input") as typeof styled.input).attrs(
({ $text }) => ({
"aria-label": $text,
}),
)``;
const StyledComponent = styled(Component)``;
const { container } = render(<StyledComponent $text="hello world" />);

Expand Down Expand Up @@ -139,7 +141,9 @@ it("should concatenate styles", () => {
});

it("should not add class if prop is not set", () => {
const Component = (styled("input") as typeof styled.input)(({ testProp }) => testProp && css("test"));
const Component = (styled("input") as typeof styled.input)(
({ testProp }) => testProp && css("test"),
);

const { container } = render(<Component />);

Expand All @@ -151,7 +155,9 @@ it("should not add class if prop is not set", () => {
});

it("should add class if prop is set", () => {
const Component = (styled("input") as typeof styled.input)(({ $testProp }) => $testProp && css("test"));
const Component = (styled("input") as typeof styled.input)(
({ $testProp }) => $testProp && css("test"),
);

const { container } = render(<Component $testProp />);

Expand All @@ -165,7 +171,9 @@ it("should add class if prop is set", () => {
});

it("should allow falsy values", () => {
const Component = (styled("input") as typeof styled.input)(({ $testProp }) => $testProp && css("test"));
const Component = (styled("input") as typeof styled.input)(
({ $testProp }) => $testProp && css("test"),
);

const { container } = render(
<>
Expand All @@ -185,7 +193,9 @@ it("should allow falsy values", () => {
});

it("should execute runtime styles recursively", () => {
const Component = (styled("input") as typeof styled.input)<{ $testProp: boolean }>(
const Component = (styled("input") as typeof styled.input)<{
$testProp: boolean;
}>(
({ $testProp }) =>
$testProp &&
css(
Expand Down Expand Up @@ -279,7 +289,9 @@ it("should keep theme if theme is passed to element", () => {
});

it("should remove theme on wrapped element", () => {
const BaseComponent = (styled("input") as typeof styled.input)((p) => p && css("test"));
const BaseComponent = (styled("input") as typeof styled.input)(
(p) => p && css("test"),
);
const Component = styled(BaseComponent)((p) => p && css("test-wrapper"));

const { container } = render(
Expand Down
15 changes: 6 additions & 9 deletions packages/next-yak/runtime/mocks/styled.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,6 @@
import { styled as StyledFactory } from "../styled.js"
export const styled = new Proxy(
StyledFactory as any,
{
get(target, TagName: keyof JSX.IntrinsicElements) {
return target(TagName);
},
},
);
import { styled as StyledFactory } from "../styled.js";
export const styled = new Proxy(StyledFactory as any, {
get(target, TagName: keyof JSX.IntrinsicElements) {
return target(TagName);
},
});

0 comments on commit 8b1b50d

Please sign in to comment.