Hacker News dev tools console job highlighter

hn-gib-job.js

document.querySelectorAll('.athing.comtr').forEach(job => {
	const jobText = job.innerText.toLowerCase();
	const rejectWords = ['europe', 'staff', 'sr.', 'senior', 'lead', 'principal', 'uk', 'spain', 'portugal', 'netherlands', 'berlin', 'germany', 'devops', 'eu', 'platform', 'onsite', 'hybrid'];
  const wantWords = ['react', 'javascript', 'python', 'rails', 'node'];
  
  const wanted = wantWords.some(word => jobText.includes(word));
  
  if (wanted) {
  	  const rejected = rejectWords.some(word => jobText.includes(word));
    
      if (!rejected) {
        job.style.backgroundColor = 'rgb(0, 255, 0, 0.3)';
      } else {
        job.remove();
      }
  } else {
  	job.remove();
  }
});

Looks like this right now, I saw some false-positives so will add an underline red feature under the bad word, more looping

this version that higlights words/rebuilds html is not good

const higlightRejectWords = (wordsHtml, rejectWords) => {
  const htmlTextParts = wordsHtml.split(' ');

  let newHtml = [];

  htmlTextParts.forEach(part => {
    // bad but concerned about tag wrappers, char space
    const rejectWordId = rejectWords.indexOf(part);

    if (rejectWordId > -1) {
      const strParts = wordsHtml.split(part);

      newHtml.push(strParts[0] + rejectWords[rejectWordId].replace(part, `<span style="color: red;">${part}</span>`) + strParts[1]);
    } else {
      newHtml.push(part);
    }
  });
  
  return newHtml.join(' ');
}

document.querySelectorAll('.athing.comtr').forEach(job => {
	const jobText = job.innerText.toLowerCase();

	const rejectWords = [
    'europe', 'staff', 'sr.', 'senior', 'lead', 'principal', 'uk', 'spain',
    'portugal', 'netherlands', 'berlin', 'germany', 'devops', 'eu', 'platform engineer', 'onsite', 'hybrid',
    '.NET', 'haskell', 'rust', 'go'
  ];

  const wantWords = ['react', 'javascript', 'python', 'rails', 'node'];
  
  const wanted = wantWords.some(word => jobText.includes(word));
  
  if (wanted) {
  	  const rejected = rejectWords.some(word => jobText.includes(word));
    
      if (!rejected) {
        job.style.backgroundColor = 'rgb(0, 255, 0, 0.3)';
        return;
      }
  }

  const repHtml = higlightRejectWords(job.innerHTML, rejectWords)

  job.innerHTML = repHtml;
});

red bg, I had this before but a lot of red to look through

document.querySelectorAll('.athing.comtr').forEach(job => {
	const jobText = job.innerText.toLowerCase();
	const rejectWords = ['europe', 'staff', 'sr.', 'senior', 'lead', 'principal', 'uk', 'spain', 'portugal', 'netherlands', 'berlin', 'germany', 'devops', 'eu', 'platform', 'onsite', 'hybrid'];
  const wantWords = ['react', 'javascript', 'python', 'rails', 'node'];
  
  const wanted = wantWords.some(word => jobText.includes(word));
  
  if (wanted) {
  	  const rejected = rejectWords.some(word => jobText.includes(word));
    
      if (!rejected) {
        job.style.backgroundColor = 'rgb(0, 255, 0, 0.3)';
      } else {
        job.style.backgroundColor = 'rgb(255, 0, 0, 0.3)';
      }
  } else {
  	job.style.backgroundColor = 'rgb(255, 0, 0, 0.3)';
  }
});

alright this one will work, took me a bit to figure out how to inject stuff into the table without affecting its look

document.querySelectorAll('.athing.comtr').forEach(job => {
	const jobText = job.innerText.toLowerCase();

	const rejectWords = [
    'europe', 'staff', 'sr.', 'senior', 'lead', 'principal', 'uk', 'spain',
    'portugal', 'netherlands', 'berlin', 'germany', 'devops', 'eu', 'platform',
    'onsite', 'hybrid', 'java', '.NET', 'haskell', 'go', 'rust'
  ];

  const wantWords = ['react', 'javascript', 'python', 'rails', 'node'];
  
  const wanted = wantWords.some(word => jobText.includes(word));
  
  if (wanted) {
      const rejectFilter = rejectWords.filter(rejectWord => jobText.includes(rejectWord));
    
      if (!rejectFilter.length) {
        job.style.backgroundColor = 'rgb(0, 255, 0, 0.3)';
      } else {
        const jobComment = job.querySelector('.comment');
        jobComment.innerHTML = `<div>` + rejectFilter.map(word => `<span style="color: red; font-weight: bold;">${word}</span>`).join(' ') + '</div>' + jobComment.innerHTML;
      }
  }
});

Looks like this

Last one, bolder text, thick full width red bottom border

document.querySelectorAll('.athing.comtr').forEach(job => {
	const jobText = job.innerText.toLowerCase();

	const rejectWords = [
    'europe', 'staff', 'sr.', 'senior', 'lead', 'principal', 'uk', 'spain',
    'portugal', 'netherlands', 'berlin', 'germany', 'devops', 'eu', 'platform',
    'onsite', 'hybrid', 'java', '.NET', 'haskell', 'go', 'rust'
  ];

  const wantWords = ['react', 'javascript', 'python', 'rails', 'node'];
  
  const wanted = wantWords.some(word => jobText.includes(word));
  
  if (wanted) {
      const rejectFilter = rejectWords.filter(rejectWord => jobText.includes(rejectWord));
    
      if (!rejectFilter.length) {
        job.style.backgroundColor = 'rgb(0, 255, 0, 0.3)';
      } else {
        const jobComment = job.querySelector('.comment');
        jobComment.innerHTML = `<div style="display: block; border-bottom: 2px solid red;">` + rejectFilter.map(word => `<span style="color: red; font-weight: bold;">${word}</span>`).join(' ') + '</div>' + jobComment.innerHTML;
      }
  }
});

This does have false positives like "go" is probably the word more than the language

Also this highlights jobs that I almost match but don't meet eg. has JavaScript but it uses Rust

this one removes the comments without want words

document.querySelectorAll('.athing.comtr').forEach(job => {
	const jobText = job.innerText.toLowerCase();

	const rejectWords = [
    'europe', 'staff', 'sr.', 'senior', 'lead', 'principal', 'uk', 'spain',
    'portugal', 'netherlands', 'berlin', 'germany', 'devops', 'eu', 'platform',
    'onsite', 'hybrid', 'java', '.net', 'haskell', 'go', 'rust', 'c#', 'asp.net', 'sre'
  ];

  const wantWords = ['react', 'javascript', 'python', 'rails', 'node'];
  
  const wanted = wantWords.some(word => jobText.includes(word));
  
  if (wanted) {
      const rejectFilter = rejectWords.filter(rejectWord => jobText.includes(rejectWord));
    
      if (!rejectFilter.length) {
        job.style.backgroundColor = 'rgb(0, 255, 0, 0.3)';
      } else {
        const jobComment = job.querySelector('.comment');
        jobComment.innerHTML = `<div style="display: block; border-bottom: 2px solid red;">` + rejectFilter.map(word => `<span style="color: red; font-weight: bold;">${word}</span>`).join(' ') + '</div>' + jobComment.innerHTML;
      }
  } else { job.remove() }
});