Prevent Hterm to share same preferences between instances (#906)

* Add a random profileId to hterm instance to differentiate PreferenceManager used internally

* Use getPrefs() method instead of accessing prefs_ private property directly
This commit is contained in:
chabou 2016-10-20 00:55:06 +02:00 committed by Guillermo Rauch
parent a8b17e6322
commit 3f352ec137

View file

@ -1,6 +1,7 @@
/* global Blob,URL,requestAnimationFrame */ /* global Blob,URL,requestAnimationFrame */
import React from 'react'; import React from 'react';
import Color from 'color'; import Color from 'color';
import uuid from 'uuid';
import hterm from '../hterm'; import hterm from '../hterm';
import Component from '../component'; import Component from '../component';
import {getColorList} from '../utils/colors'; import {getColorList} from '../utils/colors';
@ -20,7 +21,7 @@ export default class Term extends Component {
componentDidMount() { componentDidMount() {
const {props} = this; const {props} = this;
this.term = props.term || new hterm.Terminal(); this.term = props.term || new hterm.Terminal(uuid.v4());
// the first term that's created has unknown size // the first term that's created has unknown size
// subsequent new tabs have size // subsequent new tabs have size
@ -28,30 +29,32 @@ export default class Term extends Component {
this.term.realizeSize_(props.cols, props.rows); this.term.realizeSize_(props.cols, props.rows);
} }
this.term.prefs_.set('font-family', props.fontFamily); const prefs = this.term.getPrefs();
this.term.prefs_.set('font-size', props.fontSize);
this.term.prefs_.set('font-smoothing', props.fontSmoothing); prefs.set('font-family', props.fontFamily);
this.term.prefs_.set('cursor-color', this.validateColor(props.cursorColor, 'rgba(255,255,255,0.5)')); prefs.set('font-size', props.fontSize);
this.term.prefs_.set('enable-clipboard-notice', false); prefs.set('font-smoothing', props.fontSmoothing);
this.term.prefs_.set('foreground-color', props.foregroundColor); prefs.set('cursor-color', this.validateColor(props.cursorColor, 'rgba(255,255,255,0.5)'));
this.term.prefs_.set('background-color', 'transparent'); prefs.set('enable-clipboard-notice', false);
this.term.prefs_.set('color-palette-overrides', getColorList(props.colors)); prefs.set('foreground-color', props.foregroundColor);
this.term.prefs_.set('user-css', this.getStylesheet(props.customCSS)); prefs.set('background-color', 'transparent');
this.term.prefs_.set('scrollbar-visible', false); prefs.set('color-palette-overrides', getColorList(props.colors));
this.term.prefs_.set('receive-encoding', 'raw'); prefs.set('user-css', this.getStylesheet(props.customCSS));
this.term.prefs_.set('send-encoding', 'raw'); prefs.set('scrollbar-visible', false);
this.term.prefs_.set('alt-sends-what', 'browser-key'); prefs.set('receive-encoding', 'raw');
prefs.set('send-encoding', 'raw');
prefs.set('alt-sends-what', 'browser-key');
if (props.bell === 'SOUND') { if (props.bell === 'SOUND') {
this.term.prefs_.set('audible-bell-sound', this.props.bellSoundURL); prefs.set('audible-bell-sound', this.props.bellSoundURL);
} else { } else {
this.term.prefs_.set('audible-bell-sound', ''); prefs.set('audible-bell-sound', '');
} }
if (props.copyOnSelect) { if (props.copyOnSelect) {
this.term.prefs_.set('copy-on-select', true); prefs.set('copy-on-select', true);
} else { } else {
this.term.prefs_.set('copy-on-select', false); prefs.set('copy-on-select', false);
} }
this.term.onTerminalReady = () => { this.term.onTerminalReady = () => {
@ -83,23 +86,26 @@ export default class Term extends Component {
if (this.props.onWheel) { if (this.props.onWheel) {
this.props.onWheel(e); this.props.onWheel(e);
} }
this.term.prefs_.set('scrollbar-visible', true); const prefs = this.term.getPrefs();
prefs.set('scrollbar-visible', true);
clearTimeout(this.scrollbarsHideTimer); clearTimeout(this.scrollbarsHideTimer);
if (!this.scrollMouseEnter) { if (!this.scrollMouseEnter) {
this.scrollbarsHideTimer = setTimeout(() => { this.scrollbarsHideTimer = setTimeout(() => {
this.term.prefs_.set('scrollbar-visible', false); prefs.set('scrollbar-visible', false);
}, 1000); }, 1000);
} }
} }
handleScrollEnter() { handleScrollEnter() {
clearTimeout(this.scrollbarsHideTimer); clearTimeout(this.scrollbarsHideTimer);
this.term.prefs_.set('scrollbar-visible', true); const prefs = this.term.getPrefs();
prefs.set('scrollbar-visible', true);
this.scrollMouseEnter = true; this.scrollMouseEnter = true;
} }
handleScrollLeave() { handleScrollLeave() {
this.term.prefs_.set('scrollbar-visible', false); const prefs = this.term.getPrefs();
prefs.set('scrollbar-visible', false);
this.scrollMouseEnter = false; this.scrollMouseEnter = false;
} }
@ -219,24 +225,26 @@ export default class Term extends Component {
this.clear(); this.clear();
} }
const prefs = this.term.getPrefs();
if (this.props.fontSize !== nextProps.fontSize) { if (this.props.fontSize !== nextProps.fontSize) {
this.term.prefs_.set('font-size', nextProps.fontSize); prefs.set('font-size', nextProps.fontSize);
} }
if (this.props.foregroundColor !== nextProps.foregroundColor) { if (this.props.foregroundColor !== nextProps.foregroundColor) {
this.term.prefs_.set('foreground-color', nextProps.foregroundColor); prefs.set('foreground-color', nextProps.foregroundColor);
} }
if (this.props.fontFamily !== nextProps.fontFamily) { if (this.props.fontFamily !== nextProps.fontFamily) {
this.term.prefs_.set('font-family', nextProps.fontFamily); prefs.set('font-family', nextProps.fontFamily);
} }
if (this.props.fontSmoothing !== nextProps.fontSmoothing) { if (this.props.fontSmoothing !== nextProps.fontSmoothing) {
this.term.prefs_.set('font-smoothing', nextProps.fontSmoothing); prefs.set('font-smoothing', nextProps.fontSmoothing);
} }
if (this.props.cursorColor !== nextProps.cursorColor) { if (this.props.cursorColor !== nextProps.cursorColor) {
this.term.prefs_.set('cursor-color', this.validateColor(nextProps.cursorColor, 'rgba(255,255,255,0.5)')); prefs.set('cursor-color', this.validateColor(nextProps.cursorColor, 'rgba(255,255,255,0.5)'));
} }
if (this.props.cursorShape !== nextProps.cursorShape) { if (this.props.cursorShape !== nextProps.cursorShape) {
@ -244,23 +252,23 @@ export default class Term extends Component {
} }
if (this.props.colors !== nextProps.colors) { if (this.props.colors !== nextProps.colors) {
this.term.prefs_.set('color-palette-overrides', getColorList(nextProps.colors)); prefs.set('color-palette-overrides', getColorList(nextProps.colors));
} }
if (this.props.customCSS !== nextProps.customCSS) { if (this.props.customCSS !== nextProps.customCSS) {
this.term.prefs_.set('user-css', this.getStylesheet(nextProps.customCSS)); prefs.set('user-css', this.getStylesheet(nextProps.customCSS));
} }
if (this.props.bell === 'SOUND') { if (this.props.bell === 'SOUND') {
this.term.prefs_.set('audible-bell-sound', this.props.bellSoundURL); prefs.set('audible-bell-sound', this.props.bellSoundURL);
} else { } else {
this.term.prefs_.set('audible-bell-sound', ''); prefs.set('audible-bell-sound', '');
} }
if (this.props.copyOnSelect) { if (this.props.copyOnSelect) {
this.term.prefs_.set('copy-on-select', true); prefs.set('copy-on-select', true);
} else { } else {
this.term.prefs_.set('copy-on-select', false); prefs.set('copy-on-select', false);
} }
} }