mirror of
https://github.com/datashard/snapshot.git
synced 2024-11-23 22:42:27 +00:00
move prettyprint log into register.js
This commit is contained in:
Joshua
parent
f51bcae462
commit
4b96c41056
2 changed files with 108 additions and 108 deletions
|
|
@ -1,111 +1,4 @@
|
||||||
// register .snapshot() command
|
// register .snapshot() command
|
||||||
|
|
||||||
const baseStyles = [
|
|
||||||
{
|
|
||||||
name: 'info',
|
|
||||||
color: '#cbd5e1',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'success',
|
|
||||||
color: '#10b981',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'warning',
|
|
||||||
color: '#fbbf24',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'error',
|
|
||||||
color: '#dc2626',
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Helper function to convert hex colors to rgb
|
|
||||||
* @param {string} hex - hex color
|
|
||||||
* @returns {string}
|
|
||||||
*
|
|
||||||
* @example
|
|
||||||
* // returns "255 255 255"
|
|
||||||
* hex2rgb("#ffffff")
|
|
||||||
*/
|
|
||||||
function hex2rgb(hex) {
|
|
||||||
const r = parseInt(hex.slice(1, 3), 16)
|
|
||||||
const g = parseInt(hex.slice(3, 5), 16)
|
|
||||||
const b = parseInt(hex.slice(5, 7), 16)
|
|
||||||
|
|
||||||
return `${r} ${g} ${b}`
|
|
||||||
}
|
|
||||||
|
|
||||||
baseStyles.forEach((style) => {
|
|
||||||
createCustomLog(style.name, style.color)
|
|
||||||
})
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Create a custom log
|
|
||||||
* @param {string} name - Name of the custom log
|
|
||||||
* @param {string} baseColor - Base color of the custom log in hex format
|
|
||||||
*
|
|
||||||
* @example
|
|
||||||
* // Create a custom log with name "misc" and base color "#9333ea"
|
|
||||||
* createCustomLog("misc", "#9333ea")
|
|
||||||
*/
|
|
||||||
export function createCustomLog(name, baseColor) {
|
|
||||||
if (!name || !baseColor) {
|
|
||||||
throw new Error('Missing parameters')
|
|
||||||
}
|
|
||||||
|
|
||||||
const logStyle = document.createElement('style')
|
|
||||||
|
|
||||||
logStyle.textContent = `
|
|
||||||
.command.command-name-log-${name} span.command-method {
|
|
||||||
margin-right: 0.5rem;
|
|
||||||
min-width: 10px;
|
|
||||||
border-radius: 0.125rem;
|
|
||||||
border-width: 1px;
|
|
||||||
padding-left: 0.375rem;
|
|
||||||
padding-right: 0.375rem;
|
|
||||||
padding-top: 0.125rem;
|
|
||||||
padding-bottom: 0.125rem;
|
|
||||||
text-transform: uppercase;
|
|
||||||
|
|
||||||
border-color: rgb(${hex2rgb(baseColor)} / 1);
|
|
||||||
background-color: rgb(${hex2rgb(baseColor)} / 0.2);
|
|
||||||
color: rgb(${hex2rgb(baseColor)} / 1) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.command.command-name-log-${name} span.command-message{
|
|
||||||
color: rgb(${hex2rgb(baseColor)} / 1);
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.command.command-name-log-${name} span.command-message strong,
|
|
||||||
.command.command-name-log-${name} span.command-message em {
|
|
||||||
color: rgb(${hex2rgb(baseColor)} / 1);
|
|
||||||
}
|
|
||||||
`
|
|
||||||
|
|
||||||
Cypress.$(window.top.document.head).append(logStyle)
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Print a message with a formatted style
|
|
||||||
* @param {Object} log - The message to be printed.
|
|
||||||
* @param {string} log.title - The title of the message.
|
|
||||||
* @param {string} log.message - The content of the message.
|
|
||||||
* @param {('info' | 'warning' | 'error' | 'success')} log.type - The type of the message.
|
|
||||||
*
|
|
||||||
* @example
|
|
||||||
* // Print a message with a formatted style e.g. success
|
|
||||||
* cy.print({ title: 'foo', message: 'bar', type: 'success' })
|
|
||||||
*/
|
|
||||||
function cyPrint({ title, message, type }) {
|
|
||||||
Cypress.log({
|
|
||||||
name: `log-${type}`,
|
|
||||||
displayName: `${title}`,
|
|
||||||
message,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
Cypress.Commands.add('SNAPSHOT_prettyprint', cyPrint)
|
|
||||||
|
|
||||||
require('../../src/index').register()
|
require('../../src/index').register()
|
||||||
|
|
|
||||||
109
src/register.js
109
src/register.js
|
|
@ -2,12 +2,119 @@ const lazy = require("lazy-ass");
|
||||||
const is = require("check-more-types");
|
const is = require("check-more-types");
|
||||||
const snapshot = require("./snapshot");
|
const snapshot = require("./snapshot");
|
||||||
|
|
||||||
|
const baseStyles = [
|
||||||
|
{
|
||||||
|
name: 'info',
|
||||||
|
color: '#cbd5e1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'success',
|
||||||
|
color: '#10b981',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'warning',
|
||||||
|
color: '#fbbf24',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'error',
|
||||||
|
color: '#dc2626',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Helper function to convert hex colors to rgb
|
||||||
|
* @param {string} hex - hex color
|
||||||
|
* @returns {string}
|
||||||
|
*
|
||||||
|
* @example
|
||||||
|
* // returns "255 255 255"
|
||||||
|
* hex2rgb("#ffffff")
|
||||||
|
*/
|
||||||
|
function hex2rgb(hex) {
|
||||||
|
const r = parseInt(hex.slice(1, 3), 16)
|
||||||
|
const g = parseInt(hex.slice(3, 5), 16)
|
||||||
|
const b = parseInt(hex.slice(5, 7), 16)
|
||||||
|
|
||||||
|
return `${r} ${g} ${b}`
|
||||||
|
}
|
||||||
|
|
||||||
|
baseStyles.forEach((style) => {
|
||||||
|
createCustomLog(style.name, style.color)
|
||||||
|
})
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Create a custom log
|
||||||
|
* @param {string} name - Name of the custom log
|
||||||
|
* @param {string} baseColor - Base color of the custom log in hex format
|
||||||
|
*
|
||||||
|
* @example
|
||||||
|
* // Create a custom log with name "misc" and base color "#9333ea"
|
||||||
|
* createCustomLog("misc", "#9333ea")
|
||||||
|
*/
|
||||||
|
export function createCustomLog(name, baseColor) {
|
||||||
|
if (!name || !baseColor) {
|
||||||
|
throw new Error('Missing parameters')
|
||||||
|
}
|
||||||
|
|
||||||
|
const logStyle = document.createElement('style')
|
||||||
|
|
||||||
|
logStyle.textContent = `
|
||||||
|
.command.command-name-log-${name} span.command-method {
|
||||||
|
margin-right: 0.5rem;
|
||||||
|
min-width: 10px;
|
||||||
|
border-radius: 0.125rem;
|
||||||
|
border-width: 1px;
|
||||||
|
padding-left: 0.375rem;
|
||||||
|
padding-right: 0.375rem;
|
||||||
|
padding-top: 0.125rem;
|
||||||
|
padding-bottom: 0.125rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
|
||||||
|
border-color: rgb(${hex2rgb(baseColor)} / 1);
|
||||||
|
background-color: rgb(${hex2rgb(baseColor)} / 0.2);
|
||||||
|
color: rgb(${hex2rgb(baseColor)} / 1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.command.command-name-log-${name} span.command-message{
|
||||||
|
color: rgb(${hex2rgb(baseColor)} / 1);
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.command.command-name-log-${name} span.command-message strong,
|
||||||
|
.command.command-name-log-${name} span.command-message em {
|
||||||
|
color: rgb(${hex2rgb(baseColor)} / 1);
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
Cypress.$(window.top.document.head).append(logStyle)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Print a message with a formatted style
|
||||||
|
* @param {Object} log - The message to be printed.
|
||||||
|
* @param {string} log.title - The title of the message.
|
||||||
|
* @param {string} log.message - The content of the message.
|
||||||
|
* @param {('info' | 'warning' | 'error' | 'success')} log.type - The type of the message.
|
||||||
|
*
|
||||||
|
* @example
|
||||||
|
* // Print a message with a formatted style e.g. success
|
||||||
|
* cy.print({ title: 'foo', message: 'bar', type: 'success' })
|
||||||
|
*/
|
||||||
|
function cyPrint({ title, message, type }) {
|
||||||
|
Cypress.log({
|
||||||
|
name: `log-${type}`,
|
||||||
|
displayName: `${title}`,
|
||||||
|
message,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
module.exports = () => {
|
module.exports = () => {
|
||||||
lazy(is.fn(global.before), "Missing global before function");
|
lazy(is.fn(global.before), "Missing global before function");
|
||||||
lazy(is.fn(global.after), "Missing global after function");
|
lazy(is.fn(global.after), "Missing global after function");
|
||||||
lazy(is.object(global.Cypress), "Missing Cypress object");
|
lazy(is.object(global.Cypress), "Missing Cypress object");
|
||||||
|
|
||||||
Cypress.Commands.add("snapshot", { prevSubject: "optional" }, snapshot);
|
Cypress.Commands.add("snapshot", { prevSubject: "optional" }, snapshot);
|
||||||
|
Cypress.Commands.add('SNAPSHOT_prettyprint', cyPrint)
|
||||||
|
|
||||||
return snapshot;
|
return Cypress;
|
||||||
};
|
};
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue