Hi NMTeam this appears to be by design, as the link uses the download attribute, which tells the browser to download the document and so it will not be viewed as a design/functional fault by articulate. I think the design of the component with the arrow icon pointing down, also indicates that the button is download, rather than open in a new window.
In order to get around this, you would need to include a piece of JavaScript in your project that removes the download attribute from these components.
// Select the target container element
const lessonBlocks = document.querySelector('section.blocks-lesson');
// Options for the observer (which types of mutations to observe)
const config = {
childList: true, // Listen for changes to child elements
attributes: true, // Listen for changes to attributes
subtree: true, // Monitor all descendant nodes of the target
characterData: true // Monitor changes to text content
};
// Callback function to execute when mutations are observed
const callback = (mutationsList, observer) => {
const dl = document.querySelectorAll('a[download].block-attachment');
dl.forEach(function (el, ix) {
el.removeAttribute('download');
});
};
// Create an observer instance linked to the callback function
const observer = new MutationObserver(callback);
// Start observing the target node with the configured options
observer.observe(lessonBlocks, config);
// run first time
callback();
If you need to differentiate between different file type and treat them differently, you need to add some logic to look at the file extension. Here's a quick crude example:
// Callback function to execute when mutations are observed
const callback = (mutationsList, observer) => {
const dl = document.querySelectorAll('a[download].block-attachment');
dl.forEach(function (el, ix) {
// only remove download for PDF
if(el.getAttribute('download').indexOf('.pdf') !== -1) el.removeAttribute('download');
});
};