+ "details": "### Impact\n\nThere is a possibility to save XSS code in province field in the Checkout and Address Book and then execute it on these pages. The problem occurs when you open the address step page in the checkout or edit the address in the address book. This only affects the base UI Shop provided by Sylius.\n\n### Patches\nThe issue is fixed in versions: 1.9.12, 1.10.16, 1.11.17, 1.12.16, 1.13.1 and above.\n\n### Workarounds\n\n1. Create new file `assets/shop/sylius-province-field.js`:\n\n```js\n// assets/shop/sylius-province-field.js\n\nfunction sanitizeInput(input) {\n const div = document.createElement('div');\n div.textContent = input;\n return div.innerHTML; // Converts text content to plain HTML, stripping any scripts\n}\n\nconst getProvinceInputValue = function getProvinceInputValue(valueSelector) {\n return valueSelector == undefined ? '' : `value=\"${sanitizeInput(valueSelector)}\"`;\n};\n\n$.fn.extend({\n provinceField() {\n const countrySelect = $('select[name$=\"[countryCode]\"]');\n\n countrySelect.on('change', (event) => {\n const select = $(event.currentTarget);\n const provinceContainer = select.parents('.field').next('div.province-container');\n\n const provinceSelectFieldName = select.attr('name').replace('country', 'province');\n const provinceInputFieldName = select.attr('name').replace('countryCode', 'provinceName');\n\n const provinceSelectFieldId = select.attr('id').replace('country', 'province');\n const provinceInputFieldId = select.attr('id').replace('countryCode', 'provinceName');\n\n const form = select.parents('form');\n\n if (select.val() === '' || select.val() == undefined) {\n provinceContainer.fadeOut('slow', () => {\n provinceContainer.html('');\n });\n\n return;\n }\n\n provinceContainer.attr('data-loading', true);\n form.addClass('loading');\n\n $.get(provinceContainer.attr('data-url'), { countryCode: select.val() }, (response) => {\n if (!response.content) {\n provinceContainer.fadeOut('slow', () => {\n provinceContainer.html('');\n\n provinceContainer.removeAttr('data-loading');\n form.removeClass('loading');\n });\n } else if (response.content.indexOf('select') !== -1) {\n provinceContainer.fadeOut('slow', () => {\n const provinceSelectValue = getProvinceInputValue((\n $(provinceContainer).find('select > option[selected$=\"selected\"]').val()\n ));\n\n provinceContainer.html((\n response.content\n .replace('name=\"sylius_address_province\"', `name=\"${provinceSelectFieldName}\"${provinceSelectValue}`)\n .replace('id=\"sylius_address_province\"', `id=\"${provinceSelectFieldId}\"`)\n .replace('option value=\"\" selected=\"selected\"', 'option value=\"\"')\n .replace(`option ${provinceSelectValue}`, `option ${provinceSelectValue}\" selected=\"selected\"`)\n ));\n provinceContainer.addClass('required');\n provinceContainer.removeAttr('data-loading');\n\n provinceContainer.fadeIn('fast', () => {\n form.removeClass('loading');\n });\n });\n } else {\n provinceContainer.fadeOut('slow', () => {\n const provinceInputValue = getProvinceInputValue($(provinceContainer).find('input').val());\n\n provinceContainer.html((\n response.content\n .replace('name=\"sylius_address_province\"', `name=\"${provinceInputFieldName}\"${provinceInputValue}`)\n .replace('id=\"sylius_address_province\"', `id=\"${provinceInputFieldId}\"`)\n ));\n\n provinceContainer.removeAttr('data-loading');\n\n provinceContainer.fadeIn('fast', () => {\n form.removeClass('loading');\n });\n });\n }\n });\n });\n\n if (countrySelect.val() !== '') {\n countrySelect.trigger('change');\n }\n\n if ($.trim($('div.province-container').text()) === '') {\n $('select.country-select').trigger('change');\n }\n\n const shippingAddressCheckbox = $('input[type=\"checkbox\"][name$=\"[differentShippingAddress]\"]');\n const shippingAddressContainer = $('#sylius-shipping-address-container');\n const toggleShippingAddress = function toggleShippingAddress() {\n shippingAddressContainer.toggle(shippingAddressCheckbox.prop('checked'));\n };\n toggleShippingAddress();\n shippingAddressCheckbox.on('change', toggleShippingAddress);\n },\n});\n```\n\n2. Add new import in `assets/shop/entry.js`:\n\n```js\n// assets/shop/entry.js\n// ...\nimport './sylius-province-field';\n```\n\n3. If you're using Gulp, update your `gulpfile.babel.js`:\n\n```diff\n import chug from 'gulp-chug';\n+ import concat from 'gulp-concat';\n import gulp from 'gulp';\n import yargs from 'yargs';\n\n const { argv } = ...\n\n+ const rootPath = argv.rootPath || 'public/assets';\n+ \n const config = [...];\n '--rootPath',\n argv.rootPath || '../../../../../../../public/assets',\n '--nodeModulesPath',\n argv.nodeModulesPath || '../../../../../../../node_modules',\n ];\n\n ...\n\n export const buildShop = ...\n\n+ export const patchShopJs = function patchShopJs() {\n+ return gulp.src([\n+ `${rootPath}/shop/js/app.js`,\n+ 'assets/shop/sylius-province-field.js',\n+ ])\n+ .pipe(concat('app.js'))\n+ .pipe(gulp.dest(`${rootPath}/shop/js`));\n+ };\n+ patchShopJs.description = 'Append shop security patches to built app.js.';\n\n ...\n\n- export const build = gulp.parallel(buildAdmin, buildShop);\n+ export const build = gulp.series(\n+ gulp.parallel(buildAdmin, buildShop),\n+ patchShopJs,\n+ );\n\n ...\n\n- gulp.task('shop', buildShop);\n+ gulp.task('shop', gulp.series(buildShop, patchShopJs));\n\n ...\n```\n\n4. Rebuild your assets:\n\n```bash\nyarn build\n``` \n\n### Acknowledgements\n\nThis security issue has been reported by @r2tunes, thank you!\n\n### References\n\n- The original advisory: https://github.com/advisories/GHSA-mw82-6m2g-qh6c\n\n### For more information\nIf you have any questions or comments about this advisory:\n* Open an issue in [Sylius issues](https://github.com/Sylius/Sylius/issues)\n* Email us at security@sylius.com",
![advisory-database[bot]](https://avatars.githubusercontent.com/in/21409?v=4&size=40){kind=avatar}
0 commit comments