latentflip / loupe

Visualizing the javascript runtime at runtime
http://latentflip.com/loupe
3.2k stars 502 forks source link

Cannot edit code, runs only template #31

Open ManuelRCastroIglesias opened 1 year ago

ManuelRCastroIglesias commented 1 year ago

This is my code. ` //#Source https://www.30secondsofcode.org/js/s/array-to-csv //#License https://creativecommons.org/licenses/by/4.0/

const arrTOcvs = ( arr, delimiter = ',' ) => arr .map( v => v.map( x => ( isNaN( x ) ? "${ x.replace( /"/g, '""' ) }" : x ) ).join( delimiter ) ) .join( '\n' ); console.log( arrTOcvs( [ [ 'a', 'b' ], [ 'c', 'd' ] ] ) ); // '"a","b"\n"c","d"' console.log(arrTOcvs( [ [ 'a', 'b' ], [ 'c', 'd' ] ], ';' ) ); // '"a";"b"\n"c";"d"' console.log(arrTOcvs( [ [ 'a', '"b" great' ], [ 'c', 3.1415 ] ] ) ); // '"a","""b"" great"\n"c",3.1415' `

latentflip commented 1 year ago

I think the problem is that it won't currently support code written in ES6 (so const, arrow functions, argument defaults). But it doesn't make that very clear what's going on for sure.

viT-1 commented 1 year ago

Same problem with code

console.log(1)

setTimeout(() => { console.log(2) })

const prom1 = new Promise(resolve => {
    console.log(3)
    resolve(4)
})

const prom2 = new Promise(resolve => {
    console.log(5)
    resolve(6)
})

prom1.then(console.log)
prom2.then(console.log)

console.log(7)
vgjenks commented 1 year ago

I think the problem is that it won't currently support code written in ES6 (so const, arrow functions, argument defaults). But it doesn't make that very clear what's going on for sure.

This is a super useful tool that I'm directing newer devs to - any chance you could get it updated to accommodate modern syntax? It also showed up in a course I took, and it was disappointing to see it not work with ES6 code.

seshasaisuhashdesu commented 1 year ago

Doesnt work with this code as well. Looks like its unable to locate the document. @latentflip Can you please accommodate the corrections?

// JS

//Dynamically generated image URLs
    var imageUrls = [
      'https://unsplash.com/s/photos/random',
      'https://unsplash.com/photos/Dqw5Zx7Y364',
      'https://unsplash.com/photos/l3N9Q27zULw'
    ];

    // Function to generate image elements dynamically
    function generateImages() {
      var container = document.getElementById('imageContainer');

      // Iterate through the image URLs
      imageUrls.forEach(function(url) {
        var img = document.createElement('img');
        img.src = url;
        container.appendChild(img);
      });
    }

    // Call the function to generate images
    generateImages();

//HTML

<!DOCTYPE html>
<html>
<head>
  <title>Dynamic Image URLs</title>
</head>
<body>
  <h1>Dynamic Image URLs</h1>
  <div id="imageContainer">
  </div>
</body>
</html>