v3
- by alexmacarthur 12/29/202300
Setup HTML - click to add setup HTML
disable setup JavaScript
Setup JavaScript
function limitedWith(obj, cb) {
  const keys = Object.getOwnPropertyNames(obj);
  const scopedObj = new Proxy(obj, {
    has(_target, key) {
      return keys.includes(key);
    },
  });

  return eval(`
    with(scopedObj) {
      (${cb}.bind(this))();
    }
  `);
}


function makeComplicatedObject() {
  const obj = Object.fromEntries(
    Array.from({ length: 100 }).map((_, index) => [
      `key_${index}`,
      `value_${index}`,
    ])
  );

  obj.level = '0';

  return obj;
}

const deeplyNestedObject = Array.from({ length: 100 }).reduce(
  (prevObj, _current, index) => {
    let newObject = makeComplicatedObject();
    newObject.level = index.toString();
    Object.setPrototypeOf(newObject, prevObj);
    return newObject;
  },

  makeComplicatedObject()
);

const simpleObject = {};
const flatObject = makeComplicatedObject();
const localVariable = 'hello!';
delete caserun single casemove downdrag and drop case


ready



with (deeplyNestedObject) {
	console.log(localVariable);
}
delete caserun single casemove updrag and drop case


ready



with(flatObject) {
	console.log(localVariable);
}
Test Case - click to add another test case
Teardown JS - click to add teardown JavaScript
Output (DOM) - click to monitor output (DOM) while test is running
RUN