如何正确测试javascript小部件？

因此，我编写了一个小javascript小部件。用户所要做的就是将一个脚本标记粘贴到页面中，然后在它的正下方插入一个div，其中包含用户请求的所有内容

许多网站都做类似的事情，比如Twitter、Delicious甚至StackOverflow

我好奇的是如何测试这个小部件，以确保它能在每个人的网页上正常工作。我没有使用iframe，所以我真的希望确保在插入大多数位置时，该代码能够正常工作。我知道它在所有浏览器中看起来都一样

---

建议？或者我应该只构建一百个网页，插入脚本标签，看看它是否有效？我希望有比这更简单的方法。

通过将所有Java脚本保存在一个名称空间（全局对象）下，并使用一个非常唯一的名称，您应该很好。此外，如果您只想打印一些内容，您可以简单地使用匿名函数

---

类似的问题：

在非常基本的情况下，您应该确保您的小部件适用于以下测试用例。我确信它会在所有网页上运行-

• http/https：对于未加密内容的https页面，不应该有任何警告
• /：如果禁用JavaScript怎么办？您的小部件仍然可见吗
• 禁用第三方cookie时会发生什么情况？你的小部件还能用吗
• 布局框限制：当父div元素的大小小于小部件时。您的小部件是否溢出了给定的大小并破坏了所有者页面

---

一旦您确认您的javascript在受控环境中跨浏览器工作，以下是在实际网站上使用时可能会导致问题的一些事项：

CSS

• 您使用的CSS类已经被目标网站使用（用于不同的目的）
• 您使用的定位可能会干扰网站的CSS
• 您正在使用的元素由网站的CSS设置样式（您可能希望使用某种仅适用于您的小部件的CSS）

HTML

• 您正在创建与网站上已存在的元素具有相同

  id

  属性的元素
• 您正在指定一个已被使用的

  name

  属性（虽然

  name

  可以用于多个元素，但您可能不希望这样）

Javascript

• 如果不启用Javascript，预期的行为是什么？如果您的脚本创建了所有内容，那么没有JS就没有任何内容是可以接受的吗

---

我更担心的是我注入的CSS和HTML不起作用，而不是名称空间冲突，但感谢链接。很酷，谢天谢地，我想到了其中的大部分。我更好奇的是，是否真的有任何方法来测试我在各种各样的用例中没有破坏任何这些东西。听起来我可能不得不做我最初担心的事情。我不知道有什么绝对的方法来测试你的小部件是否能在100%的网站上工作，因为你根本无法保证网站会是什么样子。你能做的最好的事情就是用你认为可能破坏它的网站/代码来尝试它，并更新你的小部件来使用它们。