justin/claude-artifact-scraper
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactored to use a build script

Browse Source
This commit is contained in:
justin committed 2025-07-13 15:32:59 -04:00
1 parent fe4b3c3e1b
commit eeb611b7af
7 files changed
+383 -330
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

.gitignore
+1
View File
@@ -0,0 +1 @@
content.js
bin/build
Executable
+35
View File
@@ -0,0 +1,35 @@
#!/bin/bash
set +e
DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" >/dev/null && pwd)"
cd "$DIR/.."
# Build script to combine all source files into a single content.js
# Create the output file and start the IIFE
echo '(function() {' >content.js
echo '' >>content.js
# Add each external library first
for file in lib/*; do
cat "$file" >>content.js
echo "// === $file ===" >>content.js
echo '' >>content.js
echo '' >>content.js
done
# Add each source file in order
for file in src/*; do
echo "// === $file ===" >>content.js
cat "$file" >>content.js
echo '' >>content.js
echo '' >>content.js
done
echo 'main();' >>content.js
# Close the IIFE
echo '})();' >>content.js
echo "Built content.js from source files"
content.js → lib/jszip.js
-330
View File
@@ -1,4 +1,3 @@
(function() {
/*!
JSZip v3.10.1 - A JavaScript class for generating and reading zip files
@@ -12,332 +11,3 @@
*/
!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{("undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this).JSZip=e()}}(function(){return function s(a,o,h){function u(r,e){if(!o[r]){if(!a[r]){var t="function"==typeof require&&require;if(!e&&t)return t(r,!0);if(l)return l(r,!0);var n=new Error("Cannot find module '"+r+"'");throw n.code="MODULE_NOT_FOUND",n}var i=o[r]={exports:{}};a[r][0].call(i.exports,function(e){var t=a[r][1][e];return u(t||e)},i,i.exports,s,a,o,h)}return o[r].exports}for(var l="function"==typeof require&&require,e=0;e<h.length;e++)u(h[e]);return u}({1:[function(e,t,r){"use strict";var d=e("./utils"),c=e("./support"),p="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";r.encode=function(e){for(var t,r,n,i,s,a,o,h=[],u=0,l=e.length,f=l,c="string"!==d.getTypeOf(e);u<e.length;)f=l-u,n=c?(t=e[u++],r=u<l?e[u++]:0,u<l?e[u++]:0):(t=e.charCodeAt(u++),r=u<l?e.charCodeAt(u++):0,u<l?e.charCodeAt(u++):0),i=t>>2,s=(3&t)<<4|r>>4,a=1<f?(15&r)<<2|n>>6:64,o=2<f?63&n:64,h.push(p.charAt(i)+p.charAt(s)+p.charAt(a)+p.charAt(o));return h.join("")},r.decode=function(e){var t,r,n,i,s,a,o=0,h=0,u="data:";if(e.substr(0,u.length)===u)throw new Error("Invalid base64 input, it looks like a data url.");var l,f=3*(e=e.replace(/[^A-Za-z0-9+/=]/g,"")).length/4;if(e.charAt(e.length-1)===p.charAt(64)&&f--,e.charAt(e.length-2)===p.charAt(64)&&f--,f%1!=0)throw new Error("Invalid base64 input, bad content length.");for(l=c.uint8array?new Uint8Array(0|f):new Array(0|f);o<e.length;)t=p.indexOf(e.charAt(o++))<<2|(i=p.indexOf(e.charAt(o++)))>>4,r=(15&i)<<4|(s=p.indexOf(e.charAt(o++)))>>2,n=(3&s)<<6|(a=p.indexOf(e.charAt(o++))),l[h++]=t,64!==s&&(l[h++]=r),64!==a&&(l[h++]=n);return l}},{"./support":30,"./utils":32}],2:[function(e,t,r){"use strict";var n=e("./external"),i=e("./stream/DataWorker"),s=e("./stream/Crc32Probe"),a=e("./stream/DataLengthProbe");function o(e,t,r,n,i){this.compressedSize=e,this.uncompressedSize=t,this.crc32=r,this.compression=n,this.compressedContent=i}o.prototype={getContentWorker:function(){var e=new i(n.Promise.resolve(this.compressedContent)).pipe(this.compression.uncompressWorker()).pipe(new a("data_length")),t=this;return e.on("end",function(){if(this.streamInfo.data_length!==t.uncompressedSize)throw new Error("Bug : uncompressed data size mismatch")}),e},getCompressedWorker:function(){return new i(n.Promise.resolve(this.compressedContent)).withStreamInfo("compressedSize",this.compressedSize).withStreamInfo("uncompressedSize",this.uncompressedSize).withStreamInfo("crc32",this.crc32).withStreamInfo("compression",this.compression)}},o.createWorkerFrom=function(e,t,r){return e.pipe(new s).pipe(new a("uncompressedSize")).pipe(t.compressWorker(r)).pipe(new a("compressedSize")).withStreamInfo("compression",t)},t.exports=o},{"./external":6,"./stream/Crc32Probe":25,"./stream/DataLengthProbe":26,"./stream/DataWorker":27}],3:[function(e,t,r){"use strict";var n=e("./stream/GenericWorker");r.STORE={magic:"\0\0",compressWorker:function(){return new n("STORE compression")},uncompressWorker:function(){return new n("STORE decompression")}},r.DEFLATE=e("./flate")},{"./flate":7,"./stream/GenericWorker":28}],4:[function(e,t,r){"use strict";var n=e("./utils");var o=function(){for(var e,t=[],r=0;r<256;r++){e=r;for(var n=0;n<8;n++)e=1&e?3988292384^e>>>1:e>>>1;t[r]=e}return t}();t.exports=function(e,t){return void 0!==e&&e.length?"string"!==n.getTypeOf(e)?function(e,t,r,n){var i=o,s=n+r;e^=-1;for(var a=n;a<s;a++)e=e>>>8^i[255&(e^t[a])];return-1^e}(0|t,e,e.length,0):function(e,t,r,n){var i=o,s=n+r;e^=-1;for(var a=n;a<s;a++)e=e>>>8^i[255&(e^t.charCodeAt(a))];return-1^e}(0|t,e,e.length,0):0}},{"./utils":32}],5:[function(e,t,r){"use strict";r.base64=!1,r.binary=!1,r.dir=!1,r.createFolders=!0,r.date=null,r.compression=null,r.compressionOptions=null,r.comment=null,r.unixPermissions=null,r.dosPermissions=null},{}],6:[function(e,t,r){"use strict";var n=null;n="undefined"!=typeof Promise?Promise:e("lie"),t.exports={Promise:n}},{lie:37}],7:[function(e,t,r){"use strict";var n="undefined"!=typeof Uint8Array&&"undefined"!=typeof Uint16Array&&"undefined"!=typeof Uint32Array,i=e("pako"),s=e("./utils"),a=e("./stream/GenericWorker"),o=n?"uint8array":"array";function h(e,t){a.call(this,"FlateWorker/"+e),this._pako=null,this._pakoAction=e,this._pakoOptions=t,this.meta={}}r.magic="\b\0",s.inherits(h,a),h.prototype.processChunk=function(e){this.meta=e.meta,null===this._pako&&this._createPako(),this._pako.push(s.transformTo(o,e.data),!1)},h.prototype.flush=function(){a.prototype.flush.call(this),null===this._pako&&this._createPako(),this._pako.push([],!0)},h.prototype.cleanUp=function(){a.prototype.cleanUp.call(this),this._pako=null},h.prototype._createPako=function(){this._pako=new i[this._pakoAction]({raw:!0,level:this._pakoOptions.level||-1});var t=this;this._pako.onData=functioLine truncated
console.log('Content script loaded');
// Check if we're in a project chat by looking for the project link with forward slash
function isProjectChat() {
const projectLink = document.querySelector('a[href*="/project/"]');
if (!projectLink) {
console.log('Not in a project chat - no project link found');
return false;
}
// Additional check: look for the forward slash separator in the project breadcrumb
const breadcrumbWithSlash = projectLink.querySelector('span.opacity-50');
if (!breadcrumbWithSlash || !breadcrumbWithSlash.textContent.includes('/')) {
console.log('Not in a project chat - no forward slash separator found');
return false;
}
return true;
}
const ArtifactScraper = {
openArtifactList() {
return new Promise((resolve, reject) => {
// Find the global artifact menu button (has the hamburger/list icon)
const artifactMenuButton = document.querySelector('button[aria-haspopup="menu"] svg[viewBox="0 0 256 256"] path[d*="M80,64a8,8,0,0,1,8-8H216"]');
const menuButton = artifactMenuButton?.closest('button');
if (!menuButton) {
reject(new Error('Global artifact menu button not found'));
return;
}
let hasResolved = false;
// Listen for menu opening
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'childList') {
const addedNodes = Array.from(mutation.addedNodes);
const menuAdded = addedNodes.some(node =>
node.nodeType === Node.ELEMENT_NODE &&
(node.querySelector('li[role="none"] div[role="menuitem"]') ||
node.getAttribute('role') === 'menu' ||
node.querySelector('[role="menu"]'))
);
if (menuAdded) {
console.log('Artifact list menu has been opened');
observer.disconnect();
if (!hasResolved) {
hasResolved = true;
resolve(true);
}
}
}
});
});
observer.observe(document.body, { childList: true, subtree: true });
// Focus and send Enter key event to open menu. Click doesn't actually work,
// likely due to react pseudoevents.
menuButton.focus();
const enterEvent = new KeyboardEvent('keydown', {
key: 'Enter',
code: 'Enter',
bubbles: true,
cancelable: true
});
menuButton.dispatchEvent(enterEvent);
// Fallback timeout so we don't accidentally listen forever.
setTimeout(() => {
if (!hasResolved) {
observer.disconnect();
hasResolved = true;
reject(new Error('Failed to open artifact list menu - timeout'));
}
}, 3000);
});
},
// Once we're sure the menu is open, this will give us the list of artifacts and tell
// us which one is currently selected.
getArtifactListItems() {
const menuItems = document.querySelectorAll('li[role="none"] div[role="menuitem"]');
const artifactHash = {};
if (menuItems.length === 0) {
console.log('No artifact list items found');
return artifactHash;
}
menuItems.forEach((item, index) => {
const filenameDiv = item.querySelector('div.line-clamp-2');
if (filenameDiv) {
const filename = filenameDiv.textContent.trim();
// Check for aria-selected attribute or other indicators of selection
const isSelected = item.getAttribute('aria-selected') === 'true' ||
item.classList.contains('bg-accent-secondary-100') ||
item.classList.contains('border-accent-secondary-100');
artifactHash[filename] = isSelected;
console.log(`Found artifact: ${filename} (${isSelected ? 'selected' : 'unselected'})`);
}
});
return artifactHash;
},
// When the menu is open, this changes the active artifact to that with the given filename.
selectArtifactListItem(filename) {
return new Promise((resolve, reject) => {
const menuItems = document.querySelectorAll('li[role="none"] div[role="menuitem"]');
let targetItem = null;
// Find the matching artifact by filename
menuItems.forEach(item => {
const filenameDiv = item.querySelector('div.line-clamp-2');
if (filenameDiv && filenameDiv.textContent.trim() === filename) {
targetItem = item;
}
});
if (!targetItem) {
reject(new Error(`Could not find artifact item for: ${filename}`));
return;
}
console.log(`Selecting artifact: ${filename}`);
// Focus and send Enter key event to select the item
// Click may or may not work here, but keydown was needed elsewhere, so we're
// sticking to it here.
targetItem.focus();
const enterEvent = new KeyboardEvent('keydown', {
key: 'Enter',
code: 'Enter',
bubbles: true,
cancelable: true
});
targetItem.dispatchEvent(enterEvent);
// Wait for artifact to load
setTimeout(() => {
resolve(true);
}, 1000);
});
},
// Get artifact content and handle selection if needed
getArtifact(filename, isCurrentlySelected) {
return new Promise(async (resolve, reject) => {
if (!isCurrentlySelected) {
const menuOpen = document.querySelector('li[role="none"] div[role="menuitem"]');
if (!menuOpen) {
try {
await this.openArtifactList();
} catch (error) {
reject(new Error(`Failed to open menu to select: ${filename} - ${error.message}`));
return;
}
}
try {
await this.selectArtifactListItem(filename);
} catch (error) {
reject(new Error(`Failed to select artifact: ${filename} - ${error.message}`));
return;
}
}
const codeBlock = document.querySelector('div.right-0 code');
if (!codeBlock) {
reject(new Error(`No code block found for artifact: ${filename}`));
return;
}
resolve(codeBlock.textContent || codeBlock.innerText || '');
});
},
// Main collection method
async collectArtifacts() {
const artifactCollection = {}; // We'll keep a map of filename: content here
// There's no path information in a Claude artifact, just filenames.
// However, the LLM itself is smart enough to know where the files should go.
// So our strategy is to make it save those paths to a files.txt artifact and store
// that separately for use in making a final map of artifacts to files for our zip export.
let fileMap = null;
await this.openArtifactList();
const artifactList = this.getArtifactListItems();
if (Object.keys(artifactList).length === 0) {
console.log('No artifacts found in list');
return { artifacts: artifactCollection, fileMap: fileMap };
}
console.log(`Found ${Object.keys(artifactList).length} artifacts to collect`);
for (const [filename, isSelected] of Object.entries(artifactList)) {
try {
const content = await this.getArtifact(filename, isSelected);
if (filename === 'files.txt') {
// This is our special llm-generated mapping that we'll need to finish our export.
fileMap = content;
console.log(`✓ Found files.txt - storing in fileMap`);
} else {
artifactCollection[filename] = content;
console.log(`✓ Collected: ${filename}`);
}
} catch (error) {
console.log(`✗ Failed to collect: ${filename} - ${error.message}`);
}
// Small delay between artifacts
await new Promise(resolve => setTimeout(resolve, 500));
}
return { artifacts: artifactCollection, fileMap: fileMap };
}
};
function exportArtifacts(artifactCollection, fileMap) {
if (!artifactCollection || artifactCollection.length === 0) {
console.warn("No non-filemap artifacts were found. Ask the LLM to copy them from the project to this chat first.");
return;
}
if (!fileMap) {
console.warn("No filemap was found. Ask the LLM to generate one. See the README for a sample prompt.");
return;
}
// Parse the file map into paths
const lines = fileMap.split('\n').filter(line => line.trim());
const pathMapping = {};
let currentPath = '';
lines.forEach(line => {
const trimmedLine = line.trim();
// Check if this is a directory (ends with /)
if (trimmedLine.endsWith('/')) {
currentPath = trimmedLine;
} else if (trimmedLine && !trimmedLine.startsWith('/')) {
if (line.startsWith(' ')) {
// File is indented, so it's in the current directory
pathMapping[trimmedLine] = currentPath + trimmedLine;
} else {
// File is at root level
pathMapping[trimmedLine] = trimmedLine;
}
}
});
// Create final map with full paths and contents
const finalMap = {};
Object.entries(artifactCollection).forEach(([filename, content]) => {
const fullPath = pathMapping[filename] || filename; // Use filename as-is if not in mapping
finalMap[fullPath] = content;
});
// Create zip file
const zip = new JSZip();
// Add each file to the zip
Object
.entries(finalMap)
.forEach(([fullPath, content]) => {
// Handle directory structure
const pathParts = fullPath.split('/');
if (pathParts.length > 1) {
// File is in a directory
const filename = pathParts.pop();
const folderPath = pathParts.join('/');
const folder = zip.folder(folderPath);
folder.file(filename, content);
} else {
// File is at root level
zip.file(fullPath, content);
}
});
// Generate timestamp for filename
const now = new Date();
const timestamp = now.getFullYear() + '-' +
String(now.getMonth() + 1).padStart(2, '0') + '-' +
String(now.getDate()).padStart(2, '0');
const zipFilename = `${timestamp}_claude-artifacts.zip`;
// Generate and download the zip
zip.generateAsync({type: "blob"})
.then(function(content) {
// Create download link
const url = URL.createObjectURL(content);
const a = document.createElement('a');
a.href = url;
a.download = zipFilename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
console.log(`✓ Downloaded: ${zipFilename}`);
})
.catch(function(error) {
console.error('Failed to generate zip:', error);
});
}
// Main function
async function main() {
console.log('Running artifact collector');
if (!isProjectChat()) {
return;
}
const result = await ArtifactScraper.collectArtifacts();
exportArtifacts(result.artifacts, result.fileMap);
}
// Run the main function
main();
})();
src/detector.js
+17
View File
@@ -0,0 +1,17 @@
const ProjectDetector = {
isProjectChat() {
const projectLink = document.querySelector('a[href*="/project/"]');
if (!projectLink) {
console.log('Not in a project chat - no project link found');
return false;
}
// Additional check: look for the forward slash separator in the project breadcrumb
const breadcrumbWithSlash = projectLink.querySelector('span.opacity-50');
if (!breadcrumbWithSlash || !breadcrumbWithSlash.textContent.includes('/')) {
console.log('Not in a project chat - no forward slash separator found');
return false;
}
return true;
}
};// No exports needed - will be in same scope after build
src/exporter.js
+113
View File
@@ -0,0 +1,113 @@
const ArtifactExporter = {
parseFileMap(fileMap) {
const lines = fileMap.split('\n').filter(line => line.trim());
const pathMapping = {};
let currentPath = '';
lines.forEach(line => {
const trimmedLine = line.trim();
// Check if this is a directory (ends with /)
if (trimmedLine.endsWith('/')) {
currentPath = trimmedLine;
} else if (trimmedLine && !trimmedLine.startsWith('/')) {
if (line.startsWith(' ')) {
// File is indented, so it's in the current directory
pathMapping[trimmedLine] = currentPath + trimmedLine;
} else {
// File is at root level
pathMapping[trimmedLine] = trimmedLine;
}
}
});
return pathMapping;
},
createFinalMapping(artifactCollection, pathMapping) {
const finalMap = {};
Object.entries(artifactCollection).forEach(([filename, content]) => {
const fullPath = pathMapping[filename] || filename; // Use filename as-is if not in mapping
finalMap[fullPath] = content;
});
return finalMap;
},
generateZipFilename() {
const now = new Date();
const timestamp = now.getFullYear() + '-' +
String(now.getMonth() + 1).padStart(2, '0') + '-' +
String(now.getDate()).padStart(2, '0');
return `${timestamp}_claude-artifacts.zip`;
},
addFilesToZip(zip, finalMap) {
Object.entries(finalMap).forEach(([fullPath, content]) => {
// Handle directory structure
const pathParts = fullPath.split('/');
if (pathParts.length > 1) {
// File is in a directory
const filename = pathParts.pop();
const folderPath = pathParts.join('/');
const folder = zip.folder(folderPath);
folder.file(filename, content);
} else {
// File is at root level
zip.file(fullPath, content);
}
});
},
downloadZip(content, filename) {
const url = URL.createObjectURL(content);
const a = document.createElement('a');
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
console.log(`✓ Downloaded: ${filename}`);
},
exportArtifacts(artifactCollection, fileMap) {
// Validation
if (!artifactCollection || Object.keys(artifactCollection).length === 0) {
console.warn("No non-filemap artifacts were found. Ask the LLM to copy them from the project to this chat first.");
return;
}
if (!fileMap) {
console.warn("No filemap was found. Ask the LLM to generate one. See the README for a sample prompt.");
return;
}
// Parse the file map into paths
const pathMapping = this.parseFileMap(fileMap);
// Create final map with full paths and contents
const finalMap = this.createFinalMapping(artifactCollection, pathMapping);
// Create zip file
const zip = new JSZip();
// Add each file to the zip
this.addFilesToZip(zip, finalMap);
// Generate filename
const zipFilename = this.generateZipFilename();
// Generate and download the zip
zip.generateAsync({type: "blob"})
.then((content) => {
this.downloadZip(content, zipFilename);
})
.catch((error) => {
console.error('Failed to generate zip:', error);
});
}
};
// No exports needed - will be in same scope after build
src/main.js
+15
View File
@@ -0,0 +1,15 @@
async function main() {
console.log('Running artifact collector');
if (!ProjectDetector.isProjectChat()) {
console.log('Not in a project chat, exiting');
return;
}
try {
const result = await ArtifactScraper.collectArtifacts();
ArtifactExporter.exportArtifacts(result.artifacts, result.fileMap);
} catch (error) {
console.error('Error during artifact collection and export:', error);
}
}
src/scraper.js
+202
View File
@@ -0,0 +1,202 @@
const ArtifactScraper = {
openArtifactList() {
return new Promise((resolve, reject) => {
// Find the global artifact menu button (has the hamburger/list icon)
const artifactMenuButton = document.querySelector('button[aria-haspopup="menu"] svg[viewBox="0 0 256 256"] path[d*="M80,64a8,8,0,0,1,8-8H216"]');
const menuButton = artifactMenuButton?.closest('button');
if (!menuButton) {
reject(new Error('Global artifact menu button not found'));
return;
}
let hasResolved = false;
// Listen for menu opening
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'childList') {
const addedNodes = Array.from(mutation.addedNodes);
const menuAdded = addedNodes.some(node =>
node.nodeType === Node.ELEMENT_NODE &&
(node.querySelector('li[role="none"] div[role="menuitem"]') ||
node.getAttribute('role') === 'menu' ||
node.querySelector('[role="menu"]'))
);
if (menuAdded) {
console.log('Artifact list menu has been opened');
observer.disconnect();
if (!hasResolved) {
hasResolved = true;
resolve(true);
}
}
}
});
});
observer.observe(document.body, { childList: true, subtree: true });
// Focus and send Enter key event to open menu. Click doesn't actually work,
// likely due to react pseudoevents.
menuButton.focus();
const enterEvent = new KeyboardEvent('keydown', {
key: 'Enter',
code: 'Enter',
bubbles: true,
cancelable: true
});
menuButton.dispatchEvent(enterEvent);
// Fallback timeout so we don't accidentally listen forever.
setTimeout(() => {
if (!hasResolved) {
observer.disconnect();
hasResolved = true;
reject(new Error('Failed to open artifact list menu - timeout'));
}
}, 3000);
});
},
getArtifactListItems() {
const menuItems = document.querySelectorAll('li[role="none"] div[role="menuitem"]');
const artifactHash = {};
if (menuItems.length === 0) {
console.log('No artifact list items found');
return artifactHash;
}
menuItems.forEach((item, index) => {
const filenameDiv = item.querySelector('div.line-clamp-2');
if (filenameDiv) {
const filename = filenameDiv.textContent.trim();
// Check for aria-selected attribute or other indicators of selection
const isSelected = item.getAttribute('aria-selected') === 'true' ||
item.classList.contains('bg-accent-secondary-100') ||
item.classList.contains('border-accent-secondary-100');
artifactHash[filename] = isSelected;
console.log(`Found artifact: ${filename} (${isSelected ? 'selected' : 'unselected'})`);
}
});
return artifactHash;
},
selectArtifactListItem(filename) {
return new Promise((resolve, reject) => {
const menuItems = document.querySelectorAll('li[role="none"] div[role="menuitem"]');
let targetItem = null;
// Find the matching artifact by filename
menuItems.forEach(item => {
const filenameDiv = item.querySelector('div.line-clamp-2');
if (filenameDiv && filenameDiv.textContent.trim() === filename) {
targetItem = item;
}
});
if (!targetItem) {
reject(new Error(`Could not find artifact item for: ${filename}`));
return;
}
console.log(`Selecting artifact: ${filename}`);
// Focus and send Enter key event to select the item
// Click may or may not work here, but keydown was needed elsewhere, so we're
// sticking to it here.
targetItem.focus();
const enterEvent = new KeyboardEvent('keydown', {
key: 'Enter',
code: 'Enter',
bubbles: true,
cancelable: true
});
targetItem.dispatchEvent(enterEvent);
// Wait for artifact to load
setTimeout(() => {
resolve(true);
}, 1000);
});
},
getArtifact(filename, isCurrentlySelected) {
return new Promise(async (resolve, reject) => {
if (!isCurrentlySelected) {
const menuOpen = document.querySelector('li[role="none"] div[role="menuitem"]');
if (!menuOpen) {
try {
await this.openArtifactList();
} catch (error) {
reject(new Error(`Failed to open menu to select: ${filename} - ${error.message}`));
return;
}
}
try {
await this.selectArtifactListItem(filename);
} catch (error) {
reject(new Error(`Failed to select artifact: ${filename} - ${error.message}`));
return;
}
}
const codeBlock = document.querySelector('div.right-0 code');
if (!codeBlock) {
reject(new Error(`No code block found for artifact: ${filename}`));
return;
}
resolve(codeBlock.textContent || codeBlock.innerText || '');
});
},
async collectArtifacts() {
const artifactCollection = {};
// There's no path information in a Claude artifact, just filenames.
// However, the LLM itself is smart enough to know where the files should go.
// So our strategy is to make it save those paths to a files.txt artifact and store
// that separately for use in making a final map of artifacts to files for our zip export.
let fileMap = null;
await this.openArtifactList();
const artifactList = this.getArtifactListItems();
if (Object.keys(artifactList).length === 0) {
console.log('No artifacts found in list');
return { artifacts: artifactCollection, fileMap: fileMap };
}
console.log(`Found ${Object.keys(artifactList).length} artifacts to collect`);
for (const [filename, isSelected] of Object.entries(artifactList)) {
try {
const content = await this.getArtifact(filename, isSelected);
if (filename === 'files.txt') {
// This is our special llm-generated mapping that we'll need to finish our export.
fileMap = content;
console.log(`✓ Found files.txt - storing in fileMap`);
} else {
artifactCollection[filename] = content;
console.log(`✓ Collected: ${filename}`);
}
} catch (error) {
console.log(`✗ Failed to collect: ${filename} - ${error.message}`);
}
// Small delay between artifacts
await new Promise(resolve => setTimeout(resolve, 500));
}
return { artifacts: artifactCollection, fileMap: fileMap };
}
};
// No exports needed - will be in same scope after build