Im currently migrating an 2.x extra to MODX 3.0.3 and having a different behavior with modifiers betwen versions.
Already checked this and this but still clueless on how to get this working
First I have a chunk, that I use to create a file, this interesting part of the chunk looks like this:
Vue.prototype.$restRoute = '/vlox/assets/components/vlox';
export default {
name: 'App',
[[!vueImportRenderer? &resId=`[[+resId]]`]], //borrame! is editing vlox [[+isEditingVlox]]
aca otro intento -> [[+isEditingVlox:is=`1`:then=`es uno`:else=`No es uno`]]
[[+isEditingVlox:is=`1`:then=`
mounted() {
setTimeout(()=>{
//Tawk section
const interval = setInterval(function() {
if (window.$_Tawk && window.$_Tawk.downloaded && window.$_Tawk.showWidget instanceof Function) {
window.$_Tawk.showWidget()
clearInterval(interval);
}
}, 500);
//Firt we pick the document
let doc = document.getElementById("app").firstChild.firstChild;
if (doc.offsetHeight === 0 || doc.offsetWidth === 0 ){
doc = document.getElementById("app").firstChild.firstChild.firstChild;
} else {
//check if we need to set the tmps style
const innerChild = document.getElementById("app").firstChild.firstChild.firstChild;
if (innerChild.offsetWidth !== doc.offsetWidth) {
doc.style['max-width'] = 'fit-content';
}
}
html2canvas(doc).then(canvas => {
canvas.toBlob((blob) => {
const formData = new FormData();
formData.append('img', blob, 'snapshot.png');
let axiosConfig = {
headers: {
'Content-Type': 'multipart/form-data'
}
};
axios.post(window.location.protocol + "//" + window.location.host + this.$restRoute +
'/rest/index.php?_rest=Blocks/' + "[[+resId]]",
formData,
axiosConfig)
.then(response => {
console.log(response);
doc.style['max-width'] = null;
})
.catch(error => {
console.log(error);
});
});
});
}, 1000);
},
`:else=`
mounted() {
//wait for the tawk api to load
const interval = setInterval(function() {
if (window.$_Tawk && window.$_Tawk.downloaded && window.$_Tawk.showWidget instanceof Function) {
window.$_Tawk.showWidget()
clearInterval(interval);
}
}, 500);
},
`]]
data(){
return{
showLoading: false
}
},
Yet, the output im getting is as follows, see how for the whole expression, just a 1 is being printed, but if I do a simple expresion it works as expected
Vue.prototype.$restRoute = '/vlox/assets/components/vlox';
export default {
name: 'App',
components: { aaaaaaaaaaaaa1_9,
}, //borrame! is editing vlox 1
aca otro intento -> es uno
1
data(){
return{
showLoading: false
}
},
Finally this is the output I get on 2.x, I’m not pasting the whole code, but it basically process as it should
Vue.prototype.$restRoute = '/vlox/assets/components/vlox';
export default {
name: 'App',
components: { appheader_322,
},
mounted() {
setTimeout(()=>{
//Tawk section
const interval = setInterval(function() {
if (window.$_Tawk && window.$_Tawk.downloaded && window.$_Tawk.showWidget instanceof Function) {
window.$_Tawk.showWidget()
clearInterval(interval);
}
}, 500);
//Firt we pick the document
let doc = document.getElementById("app").firstChild.firstChild;
if (doc.offsetHeight === 0 || doc.offsetWidth === 0 ){
doc = document.getElementById("app").firstChild.firstChild.firstChild;
} else {
//check if we need to set the tmps style
const innerChild = document.getElementById("app").firstChild.firstChild.firstChild;
if (innerChild.offsetWidth !== doc.offsetWidth) {
doc.style['max-width'] = 'fit-content';
}
}
html2canvas(doc).then(canvas => {
Should I better set the code block as another chunk?