react/no-missing-iframe-sandbox

Rule category

Security.

What it does

Enforces explicit sandbox attribute for iframe elements.

Why is this bad?

The sandbox attribute enables an extra set of restrictions for the content in the iframe. Using sandbox attribute is considered a good security practice.

Examples

This rule checks all React iframe elements and verifies that there is sandbox attribute and that it's value is valid.

Failing

import React from "react";
 
const Component = () => {
  return <iframe src="https://example.com" />;
};

import React from "react";
 
const Component = () => {
  return React.createElement("iframe", { src: "https://example.com" });
};

Passing

import React from "react";
 
const Component = () => {
  return <iframe src="https://example.com" sandbox="allow-popups" />;
};

import React from "react";
 
const Component = () => {
  return React.createElement("iframe", {
    src: "https://example.com",
    sandbox: "allow-popups",
  });
};