Security News
NIST Misses 2024 Deadline to Clear NVD Backlog
NIST has failed to meet its self-imposed deadline of clearing the NVD's backlog by the end of the fiscal year. Meanwhile, CVE's awaiting analysis have increased by 33% since June.
@heartlandone/banner-ui
Advanced tools
This package is mainly for creating custom web components built with stencil.js.
My account components is using eslint (config: .eslintrc.js
) along with prettier (config: .prettierrc.js
).
Make sure both tools have been set up properly in your IDE.
Install node dependencies
> npm install
To generate a new stencil component
> npm run generate <element_tag>
Start local server to host preview your change for stencil components
> npm run start
# or
> npm run debug # no cache
Currently, My account components has two testing environments:
my-account-campagin.spec.tsx
).MockHTMLElement
my-account-campagin.e2e.ts
)The command to run both <1> and <2> is
> npm run test
# or
> npm run test.watch # this command will re-run when src files are changed
> npm run test:single-suite <suite_file_name>
Example: npm run test:single-suite my-account-campagin.spec
> npm run test:single-case <test_case_name_regex>
Which will run only tests with a name that matches the regex. Example: npm run test:single-case "should render when set audience email"
> npm run test:single-suite -- --testNamePattern <test_case_name_regex>
Note:
stencil
is not behave the exact same as running it with jest
CLI directly (especially for non-component test suite), this is because stencil is mocking most of the html element by using its own test runtime component, hence we would suggest avoiding using jest
CLI directly to run unit tests as you might see different testing result when run it in Gitlab pipeline.src/components/my-account-campaign/my-account-campaign.tsx
// ...
/**
* The below method is e2e-test covered in
* @see{module:my-account-campaign-listen-vegaLoad-e2e}
*/
/* istanbul ignore next */
private didLoadCampaigns = () => {
this.campaignItems.forEach(async (campaign: BannerViewData) => {
await sendAudienceActivity(campaign, 'LOAD', this.audienceEmail, this.apimSubscriptionKey);
});
};
// ...
module:my-account-campaign-listen-vegaLoad-e2e
is defined in src/components/my-account-campaign/test/my-account-campaign.e2e.ts
// ...
describe('my-account-campaign', () => {
/** @module my-account-campaign-listen-vegaLoad-e2e */
it('should emit vegaLoad event when render vega-banner', async () => {
await page.setContent(`<my-account-campaign apim-subscription-key="key"></my-account-campaign>
`);
const vegaLoadEvent: EventSpy = await page.spyOnEvent('vegaLoad');
await page.waitForChanges();
const element: E2EElement = await page.find('my-account-campaign');
element.setProperty('audienceEmail', 'test@123.com');
await page.waitForChanges();
expect(vegaLoadEvent).toHaveReceivedEventTimes(1);
});
});
// ...
Make sure you have passed the necessary pre commit check by running
> npm run test
Once the above command succeeded, run this command to build the artifacts for releasing
> npm run lint
This is because the current stencil build in your workspace is staled and you need to re-build the artifacts by running npm run build
.
FAQs
My Account Banner Components
The npm package @heartlandone/banner-ui receives a total of 557 weekly downloads. As such, @heartlandone/banner-ui popularity was classified as not popular.
We found that @heartlandone/banner-ui demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 8 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
NIST has failed to meet its self-imposed deadline of clearing the NVD's backlog by the end of the fiscal year. Meanwhile, CVE's awaiting analysis have increased by 33% since June.
Security News
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
Security News
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.