npm i -D rebem-enzyme
In addition to usual Enzyme methods there are few new which lets you search for components by BEM PropTypes instead of selector:
{
block
elem
mods
mix
}This object may be called bemjson.
👉 Examples below illustrates how it work with shallow wrapper just to be short – mount wrapper has absolutely the same methods.
In addition to find().
import { BEM } from 'rebem';
import { shallow } from 'rebem-enzyme';
const wrapper = shallow(
BEM({ block: 'block' },
BEM({ block: 'block', elem: 'elem' }),
BEM({ block: 'block2' })
)
);
console.log(
wrapper.findBEM({ block: 'block', elem: 'elem' }).length
);
// 1In addition to filter().
import { BEM } from 'rebem';
import { shallow } from 'rebem-enzyme';
const wrapper = shallow(
BEM({ block: 'block' },
BEM({ block: 'block', elem: 'elem' }),
BEM({ block: 'block2' })
)
);
const children = wrapper.children();
console.log(
children.filterBEM({ block: 'block', elem: 'elem' }).length
);
// 1In addition to not().
import { BEM } from 'rebem';
import { shallow } from 'rebem-enzyme';
const wrapper = shallow(
BEM({ block: 'block' },
BEM({ block: 'block', elem: 'elem' }),
BEM({ block: 'block2' })
)
);
const children = wrapper.children();
console.log(
children.notBEM({ block: 'block', elem: 'elem' }).length
);
// 1In addition to is().
import { BEM } from 'rebem';
import { shallow } from 'rebem-enzyme';
const wrapper = shallow(
BEM({ block: 'block', elem: 'elem' })
);
console.log(
wrapper.isBEM({ block: 'block', elem: 'elem' })
);
// trueIn addition to closest().
import { BEM } from 'rebem';
import { shallow } from 'rebem-enzyme';
const wrapper = shallow(
BEM({ block: 'block', mods: { mod: true } },
BEM({ block: 'block', elem: 'elem' }),
BEM({ block: 'block2' })
)
);
const firstChild = wrapper.children().first();
console.log(
firstChild.closestBEM({ block: 'block', mods: { mod: true } }).length
);
// 1In addition to some().
import { BEM } from 'rebem';
import { shallow } from 'rebem-enzyme';
const wrapper = shallow(
BEM({ block: 'block' },
BEM({ block: 'block', elem: 'elem' }),
BEM({ block: 'block2' })
)
);
const children = wrapper.children();
console.log(
children.someBEM({ block: 'block', elem: 'elem' })
);
// trueIn addition to every().
import { BEM } from 'rebem';
import { shallow } from 'rebem-enzyme';
const wrapper = shallow(
BEM({ block: 'block' },
BEM({ block: 'block', elem: 'elem' }),
BEM({ block: 'block2' })
)
);
const children = wrapper.children();
console.log(
children.everyBEM({ block: 'block', elem: 'elem' })
);
// false