Skip to content

Instantly share code, notes, and snippets.

Roman Dvornov lahmatiy

Block or report user

Report or block lahmatiy

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View find-color-with-csstree.js
const csstree = require("css-tree");
const cssDefinitions = ["color"];
const ast = csstree.parse(`
.some-selector {
color: black;
border: 1px solid #fff;
}
`, { parseValue: false });
csstree.walk(ast, {
View get-selector-parent.js
const cssTree = require("css-tree@1.0.0-alpha.29");
function getSelectorParent(selector) {
const selectorAst = cssTree.parse(selector, { context: 'selector' });
// solution #1
selectorAst.children.prevUntil(selectorAst.children.tail, (node, item, list) => {
list.remove(item);
return node.type === 'Combinator' || node.type === 'WhiteSpace';
});
View gist:c0ea23a2f0ea091bd042d1f353fbf6f7
const cssTree = require("css-tree@1.0.0-alpha.29");
function getSelectorParent(selector) {
const selectorAst = cssTree.parse(selector, { context: 'selector' });
// solution #1
// selectorAst.children.prevUntil(selectorAst.children.tail, (node, item, list) => {
// list.remove(item);
// return node.type === 'Combinator' || node.type === 'WhiteSpace';
// });
View gist:12656e18e4a5272fb8ce8f089455f9d0
const cssTree = require("css-tree@1.0.0-alpha.29");
function getSelectorParent(selector) {
const selectorAst = cssTree.parse(selector, { context: 'selector' });
// solution #1
// selectorAst.children.prevUntil(selectorAst.children.tail, (node, item, list) => {
// list.remove(item);
// return node.type === 'Combinator' || node.type === 'WhiteSpace';
// });
@lahmatiy
lahmatiy / prop-types-patch.js
Last active Jul 9, 2018
webpack loader to patch the prop-types to get an information about the propTypes definition in a runtime (UPD: you can use ready to use package https://github.com/avito-tech/prop-types-definition)
View prop-types-patch.js
// UPDATE: you can use ready to use package prop-types-definition
// https://github.com/avito-tech/prop-types-definition
module.exports = function(content) {
return content + `
(function(ReactPropTypes) {
function unwrapValueItem(value) {
if (value) {
if (typeof value.getTypeDefinition === 'function') {
return value.getTypeDefinition();
@lahmatiy
lahmatiy / concat-ast.js
Created Apr 11, 2018
Concat AST with CSSTree. Note that CSSTree lost an original formatting on parsing.
View concat-ast.js
const csstree = require('css-tree');
const ast1 = csstree.parse('.a { color: red }', {
filename: './a.css',
positions: true
});
const ast2 = csstree.parse('.b { color: red }', {
filename: './b.css',
positions: true
});
@lahmatiy
lahmatiy / check-initial.js
Created Jan 7, 2018
Check mdn/data initial values
View check-initial.js
const csstree = require('css-tree');
const data = require('mdn-data/css/properties.json');
Object.keys(data).forEach(name => {
const prop = data[name];
if (Array.isArray(prop.initial)) {
return;
}
@lahmatiy
lahmatiy / png.inject.js
Last active Apr 16, 2018
Solution to inject/fetch a custom data to/from a PNG image
View png.inject.js
const pngSignature = Buffer.from([137, 80, 78, 71, 13, 10, 26, 10]);
const hashKey = 'react-snapshot-hash';
const crcTable = [];
const initialCrc = 0xffffffff;
for (let n = 0; n < 256; n++) {
let c = n;
for (let k = 0; k < 8; k++) {
if (c & 1) {
View makeGifStatic.js
const EXTENSION_TYPE = {
0x01: 'PlainText',
0xF9: 'GraphicControl',
0xFE: 'Comment',
0xFF: 'Application'
};
/**
* Returns total length of data blocks sequence
*
@lahmatiy
lahmatiy / results.md
Last active Oct 8, 2017
JS perf quiz
View results.md

Similar solutions with very different execution times. What's the reason? Why solution #1 is too slow?

Hint: access to .length property and to variables is not an issue.

Based on a real case in CSSTree

Node v6.11.3

N Solution #1 Solution #2
You can’t perform that action at this time.