{"ScriptPreparationCode":null,"TestCases":[{"Name":"OffscreenByOffsetWidth","Code":"function getOffscreenContainer() {\r\n let offscreenContainer = document.getElementById(\u0027offscreen-container\u0027);\r\n\r\n if (!offscreenContainer) {\r\n // If the offscreen container doesn\u0027t exist, create it\r\n offscreenContainer = document.createElement(\u0027div\u0027);\r\n offscreenContainer.id = \u0027offscreen-container\u0027;\r\n offscreenContainer.style.position = \u0027absolute\u0027;\r\n offscreenContainer.style.visibility = \u0027hidden\u0027;\r\n offscreenContainer.style.whiteSpace = \u0027nowrap\u0027;\r\n // Explicity set display to flex and flexWrap to nowrap to ensure that the elements are measured in a single line\r\n offscreenContainer.style.display = \u0027flex\u0027;\r\n offscreenContainer.style.flexWrap = \u0027nowrap\u0027;\r\n document.body.appendChild(offscreenContainer);\r\n }\r\n\r\n return offscreenContainer;\r\n}\r\n\r\nfunction offscreenElementMeasure(\r\n innerHtml,\r\n useExperimentalOffsetWidth = false\r\n) {\r\n const offscreenContainerElement = getOffscreenContainer();\r\n\r\n // Insert the innerHtml into the offscreen div\r\n offscreenContainerElement.innerHTML = innerHtml;\r\n\r\n // Measure the elements\r\n const elementWidths = Array.from(offscreenContainerElement.children).map((element) =\u003E\r\n useExperimentalOffsetWidth ? element.offsetWidth : element.getBoundingClientRect().width\r\n );\r\n\r\n // Clear the offscreen div\r\n offscreenContainerElement.innerHTML = \u0027\u0027;\r\n\r\n return {\r\n elementWidths,\r\n sumOfElementWidths: elementWidths.reduce((a, b) =\u003E a \u002B b, 0)\r\n };\r\n}\r\n\r\nconst string = \u0027\u003Cdiv id=\u0022el\u0022\u003E\u003Ch2\u003ELorem ipsum dolor sit amet\u003C/h2\u003E\u003Ch2\u003ELorem ipsum dolor sit amet\u003C/h2\u003E\u003Ch2\u003ELorem ipsum dolor sit amet\u003C/h2\u003E\u003C/div\u003E\u0027;\r\noffscreenElementMeasure(string, true);","IsDeferred":false},{"Name":"Offscreen","Code":"function getOffscreenContainer() {\r\n let offscreenContainer = document.getElementById(\u0027offscreen-container\u0027);\r\n\r\n if (!offscreenContainer) {\r\n // If the offscreen container doesn\u0027t exist, create it\r\n offscreenContainer = document.createElement(\u0027div\u0027);\r\n offscreenContainer.id = \u0027offscreen-container\u0027;\r\n offscreenContainer.style.position = \u0027absolute\u0027;\r\n offscreenContainer.style.visibility = \u0027hidden\u0027;\r\n offscreenContainer.style.whiteSpace = \u0027nowrap\u0027;\r\n // Explicity set display to flex and flexWrap to nowrap to ensure that the elements are measured in a single line\r\n offscreenContainer.style.display = \u0027flex\u0027;\r\n offscreenContainer.style.flexWrap = \u0027nowrap\u0027;\r\n document.body.appendChild(offscreenContainer);\r\n }\r\n\r\n return offscreenContainer;\r\n}\r\n\r\nfunction offscreenElementMeasure(\r\n innerHtml,\r\n useExperimentalOffsetWidth = false\r\n) {\r\n const offscreenContainerElement = getOffscreenContainer();\r\n\r\n // Insert the innerHtml into the offscreen div\r\n offscreenContainerElement.innerHTML = innerHtml;\r\n\r\n // Measure the elements\r\n const elementWidths = Array.from(offscreenContainerElement.children).map((element) =\u003E\r\n useExperimentalOffsetWidth ? element.offsetWidth : element.getBoundingClientRect().width\r\n );\r\n\r\n // Clear the offscreen div\r\n offscreenContainerElement.innerHTML = \u0027\u0027;\r\n\r\n return {\r\n elementWidths,\r\n sumOfElementWidths: elementWidths.reduce((a, b) =\u003E a \u002B b, 0)\r\n };\r\n}\r\n\r\nconst string = \u0027\u003Cdiv id=\u0022el\u0022\u003E\u003Ch2\u003ELorem ipsum dolor sit amet\u003C/h2\u003E\u003Ch2\u003ELorem ipsum dolor sit amet\u003C/h2\u003E\u003Ch2\u003ELorem ipsum dolor sit amet\u003C/h2\u003E\u003C/div\u003E\u0027;\r\noffscreenElementMeasure(string, false);","IsDeferred":false}]}