Skip to content

Commit

Permalink
pain
Browse files Browse the repository at this point in the history
  • Loading branch information
scottnath committed Mar 5, 2024
1 parent 21b04ab commit 9643e7e
Show file tree
Hide file tree
Showing 2 changed files with 167 additions and 166 deletions.
2 changes: 1 addition & 1 deletion .storybook/preview.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ global.attrGen = (args) => Object.entries(args)
.join(' ');

global.stringify = stringify;
global.stringinator = stringinator;
// global.stringinator = stringinator;
global.parseify = parseify;

/** @type { import('@storybook/web-components').Preview } */
Expand Down
331 changes: 166 additions & 165 deletions src/github/user/user.stories.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { parseFetchedRepo } from '../repository/content.js';
import { getElements, ensureElements, ensureScreenRead } from './user.shared-spec';
import { primerThemes } from '../../../.storybook/primer-preview.js';
import { within as shadowWithin } from 'shadow-dom-testing-library';
import { stringinator } from '../../utils/index.js';
import './index.js';

export default {
Expand Down Expand Up @@ -37,19 +38,19 @@ export default {
},
};

export const User = {
args: parseFetchedUser(userScottnath),
play: async ({ args, canvasElement, step }) => {
console.log('USER = elms', canvasElement.closest('body').innerHTML)
const elements = await getElements(canvasElement);
await ensureElements(elements, args);
await ensureScreenRead(elements, args);
}
}
// export const User = {
// args: parseFetchedUser(userScottnath),
// play: async ({ args, canvasElement, step }) => {
// console.log('USER = elms', canvasElement.closest('body').innerHTML)
// const elements = await getElements(canvasElement);
// await ensureElements(elements, args);
// await ensureScreenRead(elements, args);
// }
// }

export const UserRepos = {
args: {
...User.args,
...parseFetchedUser(userScottnath),
name: 'Scoot Nerth',
repos2: stringinator([parseFetchedRepo(repoProfileComponents), parseFetchedRepo(repoStorydocker)]),
},
Expand All @@ -61,184 +62,184 @@ export const UserRepos = {
}
}

export const PopularUser = {
args: parseFetchedUser(userSindresorhus),
play: User.play,
}

export const OnlyRequired = {
args: {
login: userScottnath.login,
name: userScottnath.name,
},
play: User.play,
}

export const Fetch = {
args: {
login: userScottnath.login,
fetch: true,
},
parameters: {
fetchMock: {
mocks: [
{
response: generateMockResponse(userScottnath, 'users'),
}
]
}
},
play: async ({ args, canvasElement, step }) => {
const elements = await getElements(canvasElement);
const argsAfterFetch = {
...parseFetchedUser({...userScottnath}),
...args,
};
await ensureElements(elements, argsAfterFetch);
await ensureScreenRead(elements, argsAfterFetch);
}
};
// export const PopularUser = {
// args: parseFetchedUser(userSindresorhus),
// play: User.play,
// }

export const FetchOverides = {
args: {
login: userScottnath.login,
fetch: true,
name: "Meowy McMeowerstein",
bio: "Spending time purring and sleepin",
avatar_url: 'cat-square.jpeg',
followers: "500000",
following: "2980",
repos: stringify([{"full_name":"scottnath/profile-components","description":"Cool thing, does stuff","language":"HTML"}])
},
parameters: {
mockData: [
generateMockResponse(userScottnath, 'users'),
]
},
play: async ({ args, canvasElement, step }) => {
const elements = await getElements(canvasElement);
const argsAfterFetch = {
...parseFetchedUser({...userScottnath}),
...args,
};
await ensureElements(elements, argsAfterFetch);
await ensureScreenRead(elements, argsAfterFetch);
}
}
// export const OnlyRequired = {
// args: {
// login: userScottnath.login,
// name: userScottnath.name,
// },
// play: User.play,
// }

export const ReposFetch = {
args: {
login: userScottnath.login,
fetch: true,
repos: stringify([repoProfileComponents.name, repoStorydocker.full_name]),
},
parameters: {
fetchMock: {
mocks: [
{
response: generateMockResponse(userScottnath, 'users'),
},
{
response: generateMockResponse(repoProfileComponents, 'repos'),
},
{
response: generateMockResponse(repoStorydocker, 'repos'),
}
]
}
// mockData: [
// generateMockResponse(userScottnath, 'users'),
// generateMockResponse(repoProfileComponents, 'repos'),
// generateMockResponse(repoStorydocker, 'repos'),
// ]
},
play: async ({ args, canvasElement, step }) => {
const elements = await getElements(canvasElement);
console.log('ReposFetchReposFetch = elms', elements.container.innerHTML)
const argsAfterFetch = {
...parseFetchedUser({...userScottnath}),
...args,
repos: stringify([repoProfileComponents, repoStorydocker]),
repositories: [parseFetchedRepo(repoProfileComponents), parseFetchedRepo(repoStorydocker)]
};
console.log('argsAfterFetch', argsAfterFetch)
await ensureElements(elements, argsAfterFetch);
await ensureScreenRead(elements, argsAfterFetch);
}
}
// export const Fetch = {
// args: {
// login: userScottnath.login,
// fetch: true,
// },
// parameters: {
// fetchMock: {
// mocks: [
// {
// response: generateMockResponse(userScottnath, 'users'),
// }
// ]
// }
// },
// play: async ({ args, canvasElement, step }) => {
// const elements = await getElements(canvasElement);
// const argsAfterFetch = {
// ...parseFetchedUser({...userScottnath}),
// ...args,
// };
// await ensureElements(elements, argsAfterFetch);
// await ensureScreenRead(elements, argsAfterFetch);
// }
// };

// export const FetchError = {
// export const FetchOverides = {
// args: {
// login: 'not-a-real-user',
// login: userScottnath.login,
// fetch: true,
// name: "Meowy McMeowerstein",
// bio: "Spending time purring and sleepin",
// avatar_url: 'cat-square.jpeg',
// followers: "500000",
// following: "2980",
// repos: stringify([{"full_name":"scottnath/profile-components","description":"Cool thing, does stuff","language":"HTML"}])
// },
// parameters: {
// mockData: [
// generateMockResponse({login: 'not-a-real-user'}, 'users', 404),
// generateMockResponse(userScottnath, 'users'),
// ]
// },
// play: async ({ args, canvasElement, step }) => {
// const elements = await getElements(canvasElement);
// const argsAfterFetch = {
// ...parseFetchedUser({...userScottnath}),
// ...args,
// error: `User "${args.login}" not found`,
// };
// await ensureElements(elements, argsAfterFetch);
// await ensureScreenRead(elements, argsAfterFetch);
// }
// };
// }

// export const ContainerCheck = {
// export const ReposFetch = {
// args: {
// ...FetchOverides.args,
// theme: 'light_high_contrast'
// login: userScottnath.login,
// fetch: true,
// repos: stringify([repoProfileComponents.name, repoStorydocker.full_name]),
// },
// render: (args) => {
// const attributes = attrGen(args);

// return `
// <div style="display: flex; width: 1000px; margin: 1em;">
// <github-user ${attributes} style="flex: 1 1 200px;"></github-user>
// <github-user ${attributes} style="flex: 1 1 300px;"></github-user>
// <github-user ${attributes} style="flex: 1 1 400px;"></github-user>
// </div>
// `;
// parameters: {
// fetchMock: {
// mocks: [
// {
// response: generateMockResponse(userScottnath, 'users'),
// },
// {
// response: generateMockResponse(repoProfileComponents, 'repos'),
// },
// {
// response: generateMockResponse(repoStorydocker, 'repos'),
// }
// ]
// }
// // mockData: [
// // generateMockResponse(userScottnath, 'users'),
// // generateMockResponse(repoProfileComponents, 'repos'),
// // generateMockResponse(repoStorydocker, 'repos'),
// // ]
// },
// play: async ({ args, canvasElement, step }) => {
// const elements = await getElements(canvasElement);
// console.log('ReposFetchReposFetch = elms', elements.container.innerHTML)
// const argsAfterFetch = {
// ...parseFetchedUser({...userScottnath}),
// ...args,
// repos: stringify([repoProfileComponents, repoStorydocker]),
// repositories: [parseFetchedRepo(repoProfileComponents), parseFetchedRepo(repoStorydocker)]
// };
// console.log('argsAfterFetch', argsAfterFetch)
// await ensureElements(elements, argsAfterFetch);
// await ensureScreenRead(elements, argsAfterFetch);
// }
// }

// const themesRender = (args) => {
// const attributes = attrGen(args);
// // export const FetchError = {
// // args: {
// // login: 'not-a-real-user',
// // fetch: true,
// // },
// // parameters: {
// // mockData: [
// // generateMockResponse({login: 'not-a-real-user'}, 'users', 404),
// // ]
// // },
// // play: async ({ args, canvasElement, step }) => {
// // const elements = await getElements(canvasElement);
// // const argsAfterFetch = {
// // ...args,
// // error: `User "${args.login}" not found`,
// // };
// // await ensureElements(elements, argsAfterFetch);
// // }
// // };

// return `
// <div style="display: flex; flex-wrap: wrap; width: 1000px; margin: 1em;">
// ${primerThemes.map((theme) => {
// return `
// <github-user ${attributes} theme="${theme.value}" style="flex: 1 1 200px;"></github-user>
// `;
// }).join('')}
// ${primerThemes.map((theme) => {
// return `
// <github-user ${attributes} theme="${theme.value}" style="flex: 1 1 300px;"></github-user>
// `;
// }).join('')}
// ${primerThemes.map((theme) => {
// return `
// <github-user ${attributes} theme="${theme.value}" style="flex: 1 1 400px;"></github-user>
// `;
// }).join('')}
// </div>
// `;
// }
// // export const ContainerCheck = {
// // args: {
// // ...FetchOverides.args,
// // theme: 'light_high_contrast'
// // },
// // render: (args) => {
// // const attributes = attrGen(args);

// // return `
// // <div style="display: flex; width: 1000px; margin: 1em;">
// // <github-user ${attributes} style="flex: 1 1 200px;"></github-user>
// // <github-user ${attributes} style="flex: 1 1 300px;"></github-user>
// // <github-user ${attributes} style="flex: 1 1 400px;"></github-user>
// // </div>
// // `;
// // }
// // }

// export const Themes = {
// args: {
// ...ReposFetch.args,
// },
// render: themesRender,
// }
// // const themesRender = (args) => {
// // const attributes = attrGen(args);

// export const ThemesWithOverrides = {
// args: {
// ...FetchOverides.args,
// },
// render: themesRender,
// }
// // return `
// // <div style="display: flex; flex-wrap: wrap; width: 1000px; margin: 1em;">
// // ${primerThemes.map((theme) => {
// // return `
// // <github-user ${attributes} theme="${theme.value}" style="flex: 1 1 200px;"></github-user>
// // `;
// // }).join('')}
// // ${primerThemes.map((theme) => {
// // return `
// // <github-user ${attributes} theme="${theme.value}" style="flex: 1 1 300px;"></github-user>
// // `;
// // }).join('')}
// // ${primerThemes.map((theme) => {
// // return `
// // <github-user ${attributes} theme="${theme.value}" style="flex: 1 1 400px;"></github-user>
// // `;
// // }).join('')}
// // </div>
// // `;
// // }

// // export const Themes = {
// // args: {
// // ...ReposFetch.args,
// // },
// // render: themesRender,
// // }

// // export const ThemesWithOverrides = {
// // args: {
// // ...FetchOverides.args,
// // },
// // render: themesRender,
// // }

0 comments on commit 9643e7e

Please sign in to comment.