From 38723f95fbf895f95cfc47dfaa76217301ede7e0 Mon Sep 17 00:00:00 2001 From: Nicolas Peltier <1032754+npeltier@users.noreply.github.com> Date: Fri, 5 Jan 2024 10:03:33 +0100 Subject: [PATCH 1/5] [#1641] add parent option to createTag (#1698) - add options parameter to createTag signature, with only one parent option for now, as discussed in https://github.com/orgs/adobecom/discussions/1641, - add unit test for create Tag --- libs/utils/utils.js | 3 ++- test/utils/utils.test.js | 15 +++++++++++++++ 2 files changed, 17 insertions(+), 1 deletion(-) diff --git a/libs/utils/utils.js b/libs/utils/utils.js index 3748c140bc..645b9855ba 100644 --- a/libs/utils/utils.js +++ b/libs/utils/utils.js @@ -239,7 +239,7 @@ export function isInTextNode(node) { return node.parentElement.firstChild.nodeType === Node.TEXT_NODE; } -export function createTag(tag, attributes, html) { +export function createTag(tag, attributes, html, options = {}) { const el = document.createElement(tag); if (html) { if (html instanceof HTMLElement @@ -257,6 +257,7 @@ export function createTag(tag, attributes, html) { el.setAttribute(key, val); }); } + options.parent?.append(el); return el; } diff --git a/test/utils/utils.test.js b/test/utils/utils.test.js index e0eac39bec..548adc0066 100644 --- a/test/utils/utils.test.js +++ b/test/utils/utils.test.js @@ -3,6 +3,7 @@ import { expect } from '@esm-bundle/chai'; import sinon from 'sinon'; import { waitFor, waitForElement } from '../helpers/waitfor.js'; import { mockFetch } from '../helpers/generalHelpers.js'; +import { createTag } from '../../libs/utils/utils.js'; const utils = {}; @@ -572,6 +573,20 @@ describe('Utils', () => { }); }); + describe('createTag', async () => { + /** + * create tag creates a tag from first parameter tag name, + * second parameter is requested attributes map in created tag, + * third parameter is the innerHTML of the tag, can be either node or text, + * fourth parameter is an object of creation options: + * - @parent parent element to append the tag to. + */ + createTag('var', { class: 'foo' }, 'bar', { parent: document.body }); + const varTag = document.querySelector('body > var.foo'); + expect(varTag).to.exist; + expect(varTag.textContent).to.equal('bar'); + }); + describe('personalization', async () => { const MANIFEST_JSON = { info: { total: 2, offset: 0, limit: 2, data: [{ key: 'manifest-type', value: 'Personalization' }, { key: 'manifest-override-name', value: '' }, { key: 'name', value: '1' }] }, placeholders: { total: 0, offset: 0, limit: 0, data: [] }, experiences: { total: 1, offset: 0, limit: 1, data: [{ action: 'insertContentAfter', selector: '.marquee', 'page filter (optional)': '/products/special-offers', chrome: 'https://main--milo--adobecom.hlx.page/drafts/mariia/fragments/personalizationtext' }] }, ':version': 3, ':names': ['info', 'placeholders', 'experiences'], ':type': 'multi-sheet', From 66f6042d7214cb86e0883b6b6c71630cd0afd982 Mon Sep 17 00:00:00 2001 From: Ruchika Sinha <69535463+Ruchika4@users.noreply.github.com> Date: Fri, 5 Jan 2024 13:35:15 -0800 Subject: [PATCH 2/5] MWPW-140345-Fix issues in media QR block variant (#1658) * MWPW-140345 * MWPW-140345 * MWPW-140345 * Update media.js * Update media.css * Update unit test * Update qr block css * Update media.css * Update media.test.js * Update media.test.js --- libs/blocks/media/media.css | 6 ++++-- libs/blocks/media/media.js | 2 +- test/blocks/media/media.test.js | 30 +++++++++++++++++++++++++++++- 3 files changed, 34 insertions(+), 4 deletions(-) diff --git a/libs/blocks/media/media.css b/libs/blocks/media/media.css index bb39890a08..5b941aca15 100644 --- a/libs/blocks/media/media.css +++ b/libs/blocks/media/media.css @@ -170,6 +170,7 @@ div[class*="-up"] .media .foreground > .media-row { padding-bottom: 0; padding-top: 0; display: inline-flex; + margin-top: var(--spacing-xxs); } .media.qr-code .google-play { @@ -341,8 +342,9 @@ div[class*="-up"] .media .foreground > .media-row { .media.qr-code img.qr-code-img { display: flex; - width: 150px; - height: 170px; + width: 140px; + height: 140px; + margin-top: var(--spacing-s); } .media.qr-code .qr-button-container { diff --git a/libs/blocks/media/media.js b/libs/blocks/media/media.js index 24822ea0fd..93de7c2405 100644 --- a/libs/blocks/media/media.js +++ b/libs/blocks/media/media.js @@ -72,7 +72,7 @@ export default function init(el) { // qr code if (row.closest('.qr-code')) { - const imgQRCode = row.querySelector('.text > p.body-s > picture > img'); + const imgQRCode = row.querySelector('.text img'); if (imgQRCode) { imgQRCode.classList.add('qr-code-img'); } diff --git a/test/blocks/media/media.test.js b/test/blocks/media/media.test.js index db2ba7ec6e..28abd3c1b9 100644 --- a/test/blocks/media/media.test.js +++ b/test/blocks/media/media.test.js @@ -1,6 +1,7 @@ -import { readFile } from '@web/test-runner-commands'; +import { readFile, setViewport } from '@web/test-runner-commands'; import { expect } from '@esm-bundle/chai'; +document.head.innerHTML = ""; document.body.innerHTML = await readFile({ path: './mocks/body.html' }); const { default: init } = await import('../../../libs/blocks/media/media.js'); describe('media', () => { @@ -67,6 +68,33 @@ describe('media', () => { const appStoreCta = medias[5].querySelector('a.app-store'); expect(appStoreCta).to.exist; }); + it('desktop view has visibile qr code image and no google-play and app-store CTA', async () => { + await setViewport({ width: 1200, height: 100 }); + const qrCodeImg = medias[5].querySelector('img.qr-code-img'); + const qrCTA = medias[5].querySelectorAll('.qr-button-container'); + expect(window.getComputedStyle(qrCodeImg).getPropertyValue('display')).not.to.equal('none'); + qrCTA.forEach((cta) => { + expect(window.getComputedStyle(cta).getPropertyValue('display')).to.equal('none'); + }); + }); + it('mobile view has visibile google-play and app-store CTA and no qr code image', async () => { + await setViewport({ width: 600, height: 100 }); + const qrCodeImg = medias[5].querySelector('img.qr-code-img'); + const qrCTA = medias[5].querySelectorAll('.qr-button-container'); + expect(window.getComputedStyle(qrCodeImg).getPropertyValue('display')).to.equal('none'); + qrCTA.forEach((cta) => { + expect(window.getComputedStyle(cta).getPropertyValue('display')).not.to.equal('none'); + }); + }); + it('tablet view has visibile google-play and app-store CTA and no qr code image', async () => { + await setViewport({ width: 1199, height: 100 }); + const qrCodeImg = medias[5].querySelector('img.qr-code-img'); + const qrCTA = medias[5].querySelectorAll('.qr-button-container'); + expect(window.getComputedStyle(qrCodeImg).getPropertyValue('display')).to.equal('none'); + qrCTA.forEach((cta) => { + expect(window.getComputedStyle(cta).getPropertyValue('display')).not.to.equal('none'); + }); + }); }); describe('with bio variant', () => { it('has a bio avatar and icon-stack area', () => { From 4add6eee8ca285438cdfb2170266d8785741750a Mon Sep 17 00:00:00 2001 From: Mariia Lukianets Date: Mon, 8 Jan 2024 14:28:05 +0100 Subject: [PATCH 3/5] document OST overrides (#1692) * document OST overrides * fix typo --- libs/blocks/ost/README.md | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/libs/blocks/ost/README.md b/libs/blocks/ost/README.md index f31c463251..48c244901d 100644 --- a/libs/blocks/ost/README.md +++ b/libs/blocks/ost/README.md @@ -23,3 +23,13 @@ perform the following: - open devtools console, - execute `copy(adobeIMS.getAccessToken().token)`, - add token to OST URL querystring, e.g.: `https://mwpw-127984--milo--vladen.hlx.page/tools/ost?token=eyJhb...` + +## Settings + +| Parameter | WCS & AOS Env | WCS & AOS landscape | Example | +| :---: | :---: | :---: | :---: | +| default (no parameter) | Prod | PUBLISHED | https://milo.adobe.com/tools/ost | +| ?wcsLandscape | Prod | DRAFT | https://milo.adobe.com/tools/ost?wcsLandscape=DRAFT | +| ?env=stage | Stage | ALL | https://milo.adobe.com/tools/ost?env=stage | + +Please note that the last parameter is not yet fully functional (env=stage). It will switch OST to use aos-stg env but will still use the prod token, so OST won't find any offer. This is to be fixed when the need to use env=stage comes. From ccf951010f82c148a44f9419bfe27bb9e10f8df0 Mon Sep 17 00:00:00 2001 From: Mariia Lukianets Date: Mon, 8 Jan 2024 16:18:07 +0100 Subject: [PATCH 4/5] Create merch block README.md (#1707) * Create merch block README.md * fix code styling --- libs/blocks/merch/README.md | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) create mode 100644 libs/blocks/merch/README.md diff --git a/libs/blocks/merch/README.md b/libs/blocks/merch/README.md new file mode 100644 index 0000000000..5d0a7f256c --- /dev/null +++ b/libs/blocks/merch/README.md @@ -0,0 +1,30 @@ +# Commerce Settings + +## WCS Locale +To check which locale was used to render the price/CTA: +* In the network tab search for a 'wcs' request, e.g. +https://wcs.adobe.com/web_commerce_artifact?offer_selector_ids=PpnQ-UmW9NBwZwXlFw79zw2JybhvwIUwMTDYiIlu5qI&country=DE&language=MULT&locale=de_DE&api_key=wcms-commerce-ims-ro-user-milo&landscape=PUBLISHED +* The 'country' parameter decides the format and exact price + +### Where does the WCS 'country' parameter come from? +* Check the 'lang' parameter value on your page (it's set on tag) +* If the value is special, e.g. 'africa', Commerce(tacocat) will do the mapping. Below is an example of GeoMap, for the latest visit [tacocat project](https://git.corp.adobe.com/wcms/tacocat.js) +``` +const GeoMap = { + africa: 'en-ZA', + mena_en: 'en-DZ', + il_he: 'iw-IL', + mena_ar: 'ar-DZ', + id_id: 'in-ID', + no: 'nb-NO', + cis_en: 'en-AZ', + cis_ru: 'ru-AZ', + SEA: 'en-SG', +}; +``` +* If the value is in format 'xx-YY' (case doesn't matter), for example 'en-GB', Commerce will split it in the 'xx' becoming a language and 'YY' a country. +* If the value is in format 'xx', language only, e.g. 'hi', Commerce will set language to hindi, but fetch US prices, as US is a default value for country +* In there is no value set, 'en' language and 'US' country is used + +### Where does the 'lang' value come from? +scripts.js file, see 'locales' object, 'ietf' value. From ba21fa032258466ab1ab5529628ca4d5c68241f2 Mon Sep 17 00:00:00 2001 From: Elan Bartholomew <79870969+elan-tbx@users.noreply.github.com> Date: Mon, 8 Jan 2024 10:09:27 -0700 Subject: [PATCH 5/5] MWPW-140623 - Auto-merge main to stage (#1671) add workflow to auto-merge main into stage --- .../workflows/auto-merge-main-to-stage.yml | 23 +++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 .github/workflows/auto-merge-main-to-stage.yml diff --git a/.github/workflows/auto-merge-main-to-stage.yml b/.github/workflows/auto-merge-main-to-stage.yml new file mode 100644 index 0000000000..178a76539f --- /dev/null +++ b/.github/workflows/auto-merge-main-to-stage.yml @@ -0,0 +1,23 @@ +name: PRs to main +on: + pull_request: + branches: [main] + types: [closed] +jobs: + merge-main-to-stage: + if: github.event.pull_request.merged == true + timeout-minutes: 2 + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + - name: Set Git config + run: | + git config user.email "github-actions@github.com" + git config user.name "github-actions" + - name: Merge main to stage + run: | + git fetch + git checkout stage + git pull + git merge --no-ff main -m "Auto-merge main to stage" + git push