added backup and email client
This commit is contained in:
Generated
Vendored
+9
@@ -0,0 +1,9 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`createGlobalStyles regular 1`] = `" html, body{background:dodgerblue;}"`;
|
||||
|
||||
exports[`createGlobalStyles regular 2`] = `"<div></div>"`;
|
||||
|
||||
exports[`createGlobalStyles with theme 1`] = `"html, body{margin:0;background:blue;}"`;
|
||||
|
||||
exports[`createGlobalStyles with theme 2`] = `"<div></div>"`;
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
import { glob, createGlobalStyles } from '../index';
|
||||
import { css, setup } from 'goober';
|
||||
|
||||
jest.mock('goober', () => ({
|
||||
css: jest.fn().mockReturnValue('css()')
|
||||
}));
|
||||
|
||||
describe('global', () => {
|
||||
beforeEach(() => {
|
||||
css.mockClear();
|
||||
});
|
||||
|
||||
it('type', () => {
|
||||
expect(typeof glob).toEqual('function');
|
||||
expect(typeof createGlobalStyles).toEqual('function');
|
||||
});
|
||||
|
||||
it('glob', () => {
|
||||
glob`a:b`;
|
||||
expect(css).toBeCalledWith(['a:b']);
|
||||
});
|
||||
});
|
||||
+56
@@ -0,0 +1,56 @@
|
||||
import { h, createContext, render } from 'preact';
|
||||
import { useContext } from 'preact/hooks';
|
||||
import { setup, extractCss } from 'goober';
|
||||
import { createGlobalStyles } from '../index';
|
||||
|
||||
describe('createGlobalStyles', () => {
|
||||
it('regular', () => {
|
||||
setup(h);
|
||||
|
||||
const target = document.createElement('div');
|
||||
|
||||
const GlobalStyle = createGlobalStyles`
|
||||
html, body {
|
||||
background: dodgerblue;
|
||||
}
|
||||
`;
|
||||
|
||||
render(
|
||||
<div>
|
||||
<GlobalStyle />
|
||||
</div>,
|
||||
target
|
||||
);
|
||||
|
||||
expect(extractCss()).toMatchSnapshot();
|
||||
expect(target.innerHTML).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('with theme', () => {
|
||||
const ThemeContext = createContext();
|
||||
const useTheme = () => useContext(ThemeContext);
|
||||
|
||||
setup(h, null, useTheme);
|
||||
|
||||
const target = document.createElement('div');
|
||||
|
||||
const GlobalStyle = createGlobalStyles`
|
||||
html, body {
|
||||
margin: 0;
|
||||
background: ${(props) => props.theme.color};
|
||||
}
|
||||
`;
|
||||
|
||||
render(
|
||||
<ThemeContext.Provider value={{ color: 'blue' }}>
|
||||
<div>
|
||||
<GlobalStyle />
|
||||
</div>
|
||||
</ThemeContext.Provider>,
|
||||
target
|
||||
);
|
||||
|
||||
expect(extractCss()).toMatchSnapshot();
|
||||
expect(target.innerHTML).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
import { css, styled } from 'goober';
|
||||
|
||||
/**
|
||||
* CSS Global function to declare global styles
|
||||
* @type {Function}
|
||||
*/
|
||||
export let glob = css.bind({ g: 1 });
|
||||
|
||||
/**
|
||||
* Creates the global styles component to be used as part of your tree.
|
||||
* @returns {Function}
|
||||
*/
|
||||
export function createGlobalStyles() {
|
||||
const fn = styled.call({ g: 1 }, 'div').apply(null, arguments);
|
||||
|
||||
/**
|
||||
* This is the actual component that gets rendered.
|
||||
*/
|
||||
return function GlobalStyles(props) {
|
||||
// Call the above styled.
|
||||
fn(props);
|
||||
|
||||
// Returns a hole.
|
||||
return null;
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user